第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

ReactJS調(diào)用父方法

ReactJS調(diào)用父方法

手掌心 2019-11-26 14:26:16
我正在React React中邁出第一步，并試圖理解父母與孩子之間的交流。我正在制作表單，所以我具有用于樣式字段的組件。而且我還有包含字段并對其進行檢查的父組件。例：var LoginField = React.createClass({    render: function() {        return (            <MyField icon="user_icon" placeholder="Nickname" />        );    },    check: function () {        console.log ("aakmslkanslkc");    }})var MyField = React.createClass({    render: function() {...    },    handleChange: function(event) {//call parent!    }})有沒有辦法做到這一點。我的邏輯在reactjs“ world”上好嗎？謝謝你的時間。
查看完整描述

3 回答

?
POPMUISE

TA貢獻1765條經(jīng)驗 獲得超5個贊

您可以使用任何父方法。為此，您應該像任何簡單值一樣，將此方法從您的父級發(fā)送給您的孩子。您可以一次使用父級的許多方法。例如：


var Parent = React.createClass({

    someMethod: function(value) {

        console.log("value from child", value)

    },

    someMethod2: function(value) {

        console.log("second method used", value)

    },

    render: function() {

      return (<Child someMethod={this.someMethod} someMethod2={this.someMethod2} />);

    }

});

并將其像這樣用于Child（用于任何操作或任何子方法）：


var Child = React.createClass({

    getInitialState: function() {

      return {

        value: 'bar'

      }

    },

    render: function() {

      return (<input type="text" value={this.state.value} onClick={this.props.someMethod} onChange={this.props.someMethod2} />);

    }

});


查看完整回答
反對 回復 2019-11-26
?
智慧大石

TA貢獻1946條經(jīng)驗 獲得超3個贊

2019更新帶有React 16+和ES6

由于React.createClass從react版本16 起已棄用此功能，而新的Javascript ES6將為您帶來更多好處。


父母


import React, {Component} from 'react';

import Child from './Child';


export default class Parent extends Component {


  es6Function = (value) => {

    console.log(value)

  }


  simplifiedFunction (value) {

    console.log(value)

  }


  render () {

  return (

    <div>

    <Child

          es6Function = {this.es6Function}

          simplifiedFunction = {this.simplifiedFunction} 

        />

    </div>

    )

  }


}

兒童


import React, {Component} from 'react';


export default class Child extends Component {


  render () {

  return (

    <div>

    <h1 onClick= { () =>

            this.props.simplifiedFunction(<SomethingThatYouWantToPassIn>)

          }

        > Something</h1>

    </div>

    )

  }

}

簡化為SE6常數(shù)的無狀態(tài)子級


import React from 'react';


const Child = () => {

  return (

    <div>

    <h1 onClick= { () =>

        this.props.es6Function(<SomethingThatYouWantToPassIn>)

      }

      > Something</h1>

    </div>

  )


}

export default Child;


查看完整回答
反對 回復 2019-11-26
  • 3 回答
  • 0 關注
  • 832 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

 公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號