gpt4 book ai didi

reactjs - 替换react中的自定义html标签

转载 作者:行者123 更新时间:2023-12-03 14:18:30 33 4
gpt4 key购买 nike

在 public/index.html 中有以下代码

<body>
<some-tag><some-tag>
<script type="text/javascript">
var obj1 = document.getElementsByTagName('some-tag')[0];;
obj1.innerHTML = 'abc';
</script>
</body>

如果我单独运行index.html,这会成功将 abc 渲染为 some-tag

但是如果我使用 React,即

公共(public)/index.html

<body>
<div id="root"></div>
<script type="text/javascript">
var obj1 = document.getElementsByTagName('some-tag')[0];;
obj1.innerHTML = 'abc';
</script>
</body>

和 React 组件

class Abc extends Component {
render() {
return (<some-tag />)
}
}

和index.js

ReactDOM.render(
<Abc />
document.getElementById('root')
);

它无法操作标签并显示“abc”。有什么问题吗?

最佳答案

问题多种多样。

首先当

  var obj1 = document.getElementsByTagName('some-tag')[0];;

执行时不能保证 DOM 实际加载并且 React 实际渲染了组件的 html。

第二个问题是修改react生成的html是可能的,但这是一种反模式。

如果你想修改渲染的行为,你必须对 React 的组件进行操作,如果参数来自服务器/后端,那么你正在寻找的是服务器端渲染 (SSR)。

关于reactjs - 替换react中的自定义html标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52403349/

33 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com