如何从React.js中的父级调用函数组件中子级的函数？
我有两个组成部分：
- 父级
- 子
class UnitMonitor extends PureComponent {
constructor() {
super();
}
state = {
img: null,
};
onChangeShcema = schemaID => {
axios.get("/api/schemata/get-schemata-nodes/" + schemaID).then(response => {
let path = response.data["0"]["file"];
// call loadFile function of child component is needed
});
render() {
return (
<Row type="flex" className="">
<Col span={25}>
<SvgViewer />
</Col>
</Row>
);
}
};
const SvgViewer = () => {
const loadFile = path => {
let svgFile = require("./images/" + path);
const svg = document.querySelector("#svgobject");
svg.setAttribute("data", svgFile);
};
return (
<div className="unit-schema-container1">
<object id="svgobject" type="image/svg+xml" data={null}></object>
</div>
);
};
export default SvgViewer;
共有1个答案
在React中，尝试在父方法上运行子方法不是一个好主意，因为这主要是一个错误设计的标志。由于您希望动态地运行SVG，因此可以传递一个带有路径或所需内容的prop，以便动态地加载SVG。但是，如果您坚持在父级上运行该方法，请查看这篇关于如何执行该操作的文章。
-
问题内容： 我用这个文章为例（做出反应的方式），但它不是为我工作。请指出我的错误，因为我不明白怎么了。 这是我看到的错误： 未捕获的TypeError：this.props.onClick不是函数 这是我的代码： 提前致谢！ 问题答案： 问题在于回调内部不引用React组件，因此是。 您可以通过将第二个参数传递给来显式设置值： 现在，回调 内部 的值与回调 外部 （即实例）的值相同。 这与Reac
-
这里有一个问题，我在React.js应用程序中有一个FormControl组件，我在其中呈现了几种不同类型的其他组件。例如，在下面的代码中，您可以看到我呈现了一个CheckBoxWithLabel。你会注意到我传递了一个函数 因此，在CheckBoxWithLabel组件（代码未显示）中，我可以使用onChange事件（react中复选框的内置事件）调用它 因此，结果是，当单击复选框时，会调用父组
-
所以我在学习java继承，我遇到了一个我不知道如何解决的问题。 我要做的是从超类中调用一个子类构造函数。我不知道这是否有任何意义，但我会尝试用一个例子来解释我自己。 我为什么要这么做？ 我希望能够主要不必处理智能手机。 我希望能够做到：
-
问题内容： 我知道都存在一些类似的问题，但是我很难理解今天对这个问题的正确想法并将其推断出我的处境。 我有一个简单的应用程序，ScoreBox有一个ScoreList，其中包含很多分数。我想让Score onClick调用ScoreList handleScoreRemove。我正在显示完整的js文件，但最重要的行是第5行和第77行。 问题答案： 你需要通过 并在组件中这样称呼它
-
我已经创建了一个按钮和文本组件，并将它们包含在搜索组件中。现在，我想用搜索组件的处理程序覆盖按钮的默认handleClick事件。但this.handleClick指向按钮组件的事件处理程序。。请帮忙。。我需要从搜索中单击，而不是从按钮中获取。。
-
问题内容： 通过回调函数将数据从子级传递到父级组件，但是不起作用。我在这里做错了什么？将数据从子级传递到父级组件-反应-通过回调函数 https://codepen.io/silentarrowz/pen/GEMQEP?editors=0010 这是代码 问题答案： 有几个问题。 1）你必须绑定 2）是异步的，因此不能保证在传递给时将其设置为所需的值。你可以做 要么 解决该问题。