使用onChange ，获取input标签的值

最新推荐文章于 2024-06-05 16:10:15 发布

daily886

最新推荐文章于 2024-06-05 16:10:15 发布

阅读量2w

点赞数 2

分类专栏： React Native js笔记文章标签： javascript

本文链接：https://blog.csdn.net/daily886/article/details/70214472

版权

React Native js笔记专栏收录该内容

13 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="./js/react.js"></script>
<script src="./js/react-dom.js"></script>

<script src="./js/browser.min.js"></script>

</head>
<body>
<div id="ex1"></div>
<script type="text/babel">
let ChangeValue = React.createClass({
//ceateClass创建的类，首字母必须大写例如 HelloMessage
//let是ECMA6的声明变量，用它所声明的变量，只在let命令所在的代码块内有效。
getInitialState(){
//getInitialState 是系统固定方法，不能变更
//用于设置 this.state 内的初始属性
return {value : 'hello!'};
},
handleChange(event){
//this.setState({})用于设置 this.state的属性
this.setState({value : event.target.value});
},
render(){
//获取input标签的值，需要使用onChange方法 , 需要使用小驼峰写法
let value = this.state.value;
return (
<div>
<input type="text" value={value} onChange={this.handleChange} />
<p>
{value}
</p>
</div>
);
}

});
ReactDOM.render(
<ChangeValue />,
document.getElementById('ex1')
)
</script>
</body>
</html>

daily886

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用onChange ，获取input标签的值

Document<!-- 原本的 react package 被拆分为 react 及 react-dom 两个 package。其中 react package 中包含 React.createElement、 .createClass、 .Component， .PropTypes， .Children 这些 API，而 react-dom package 中包含 ReactDOM
复制链接

扫一扫