首页 > 解决方案 > 使用 react javascript 子组件访问功能的问题

问题描述

他们想从子组件的组件中发挥功能。此方法调用:TypeError: Pizza__WEBPACK_IMPORTED_MODULE_2 _.default.valid 不是函数。

我尝试添加静态函数,但它不会得到值。我可以在订单中添加披萨代码,但我不会。

任何人都可以帮忙吗?

我想从下面的 Pizza 和 Show Pizza 表格中获取 disc_details。在 .js 中没有 .tsx

父类:

class Orders extends React.Component {
 constructor(props) {
  super(props);

  this.order = {
   name: "",
   preparation_time: "00:00:00",
   type: "",
 }
}


kind(){
 switch (this.order.type) {
  case 'pizza':
    return <Pizza/>;
 }
}

submit(){
console.log(Pizza.dishDetails()); // return error
}



render() {
 return (<div>
  <div>{this.state.selected ? this.kind() : ""}</div>
    <button className={styles.order_submit} onClick={this.submit.bind(this)}>Submit</button>
  </div>
 );
}

儿童班:

class Pizza extends React.Component{
    constructor(props) {
    super(props);

    this.state = {
        noOfSlices : 0,
        diameter : 0
    }
  }


  dishDetails(){
    return this.state;
}


noOfSlices(e){
    this.setState({noOfSlices : e.target.value});
}

标签: javascriptreactjs

解决方案


我有答案。我用静态值创建了静态类,这对我有用。静止的

class Static {
static defaultProps = {}
 }

export default Static;

命令

 submit(){
     console.log(Static.defaultProps)

比萨

  noOfSlices(e){
    Static.defaultProps = {noOfSlices : e.target.value};
   }

推荐阅读