Applets console error:
MiniProgramError onchange is not defined ReferenceError: onchange is not defined
The diagram below:
The code is as follows:
index.jsx
import Taro from '@tarojs/taro'
import React, { Component } from 'react'
import { View, Text ,Button} from '@tarojs/components'
import './index.less'
import Child from './Child'
export default class Index extends Component {
config={
navigationBarTitleText:'home'
}
state={
name:'Joe'
}
componentWillMount () { }
componentDidMount () {
/ / this. SetState ({name: "bill"})
}
componentWillUnmount () { }
componentDidShow () { }
componentDidHide () { }
click(){
this.setState({name:'bill'},() = >{
console.log(this.state.name)
});
}
change(){
this.setState({name:"Change name value"})
}
render () {
return (
<View className='index'>
<Child name={this.state.name} onchange={this.change.bind(this)}/>
<Button onClick={this.click}>Change the name</Button>
<Text>{this.state.name}</Text>
</View>)}}Copy the code
Child.jsx
import Taro from '@tarojs/taro';
import {View,Text,Button} from "@tarojs/components";
class Child extends Component{
clickHandle(){
this.props.onchange()
}
render(){
return(<View>
<Button onClick={this.clickHandle}>Invoke upper-level events</Button>
{this.props.name}
</View>)
}
}
Child.defalutProps={
name:"123",
onchange
}
export default Child;
Copy the code
Modify the above code slightly:
Child.jsx
import React, { Component } from 'react'
import {View,Text,Button} from "@tarojs/components";
class Child extends React.Component{
clickHandle(){
this.props.onchange()
}
render(){
return(<View>
<Button onClick={this.clickHandle}>Invoke upper-level events</Button>
{this.props.name}
</View>)
}
}
Child.defalutProps={
name:"123".onchange:null
}
export default Child;
Copy the code
Notice the part boxed below:
Debugging successful: