React 学习-9-数据,绑定+refs

阅读 35

2024-05-12

  • 获取远程数据:

componentDidMount 方法中调用ajax或者axios来获取服务端数据 并进行处理存储在state中

  • 值绑定

 html对应的标签属性值 使用花括号将其包裹其中

示例一:
render() {
    var value = this.state.value;
    return <div>
            <input type="text" value={value} onChange={this.handleChange} /> 
            <h4>{value}</h4>
           </div>;
  }

示例二:
render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <label>
          选择您最喜欢的网站
          <select value={this.state.value} onChange={this.handleChange}>
            <option value="gg">Google</option>
            <option value="rn">Runoob</option>
            <option value="tb">Taobao</option>
            <option value="fb">Facebook</option>
          </select>
        </label>
        <input type="submit" value="提交" />
      </form>
    );
  }
  • ref:用来绑定到 render() 输出的任何组件上
<input ref="myInput" />

//获取方式
var input = this.refs.myInput;
var inputValue = input.value;
var inputRect = input.getBoundingClientRect();

精彩评论(0)

0 0 举报