个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我正在尝试制作一个程序，显示输入值到输出框的更改，但出现类似未捕获类型错误的错误:无法读取 null 的属性“值”，我不知道这里的错误是什么
var App =React.createClass({
getInitialState:function(){
return{
value:"My Value"
}
},
updateValue:function(modifiedValue){
this.setState({
value:modifiedValue
})
},
render:function(){
return(
<div className="inputBox container-fluid">
<h1 className="text-center text-primary">Hello FreeCodeCampers !!!</h1>
<div className="row col-md-12">
<InputBox value={this.state.value} updateValue={this.updateValue}/>
<h1>{this.state.value}</h1>
</div>
</div>
);
}
});
var InputBox =React.createClass({
update:function(){
var modifiedValue=ReactDOM.findDOMNode(this.refs.inputValue).value;
this.props.updateValue(modifiedValue);
},
render:function(){
return(
<input type="text" value={this.props.value} onChange={this.update} ref="initialValue"/>
);
}
});
ReactDOM.render(<App />,
document.querySelector("#app")
);<!DOCTYPE html>
<head>
<meta charset="UTF-8" />
<title>React Tutorial</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<div id="app"></div>
<script src="demo.js" type="text/babel"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
</body>
</html>最佳答案
使用您的react版本(React v0.14及更高版本)，您不需要调用ReactDOM.findDOMNode(this.refs.inputValue)
this.refs.inputValue 为您提供实际的 dom 节点。您可以调用getValue()等方法来获取该节点的值。
我希望这能解决您的问题。
关于reactjs - 我的 Reactjs 代码显示未捕获的 TypeError : Cannot read property 'value' of null，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35685212/
26
4
0
我是一名优秀的程序员,十分优秀！