在 Streamlit 上集成 js 脚本答案

【问题标题】：Integrate js scripts on Streamlit在 Streamlit 上集成 js 脚本
【发布时间】：2022-01-20 20:59:29
【问题描述】：

我正在尝试使用以下代码 sn-p（通过 https://medium-widget.pixelpoint.io/ 生成）将我的 Medium 配置文件集成到流式应用程序中

import streamlit as st
st.markdown('''
<div id="medium-widget"></div>
<script src="https://medium-widget.pixelpoint.io/widget.js"></script>
<script>MediumWidget.Init({renderTo: '#medium-widget', params: {"resource":"https://medium.com/@mehulgupta_7991","postsPerLine":3,"limit":9,"picture":"small","fields":["description","author","claps","publishAt"],"ratio":"landscape"}})</script>''')

但看起来标签被忽略了。知道我哪里出错了吗？

【问题讨论】：

标签： javascript python html streamlit

【解决方案1】：

您可以使用 Streamlit 组件 html。

代码：

import streamlit as st
import streamlit.components.v1 as components

components.html('''
<div id="medium-widget"></div>
<script src="https://medium-widget.pixelpoint.io/widget.js"></script>
<script>MediumWidget.Init({renderTo: '#medium-widget', params: {"resource":"https://medium.com/@mehulgupta_7991","postsPerLine":3,"limit":9,"picture":"small","fields":["description","author","claps","publishAt"],"ratio":"landscape"}})</script>''')

输出：

【讨论】：