使用方法及细节就不一一说了。
1.给input或者textarea绑定value时,出现失效的问题。解决方法:https://github.com/vuejs/babel-plugin-transform-vue-jsx/issues/84;
2.给input绑定disabled属性时,出现时而有效时而有效的问题。解决方法同上,也是domPropsDisabled={this.disabled} (假如你定义了disabled的话);
3.在封装高阶组件时,v-model出现问题!写法如下:解决方法是加上了value={this.value}。后来在此组件中放弃了jsx的写法。搞定!
1 render() { 2 return ( 3 <z-input 4 styles={this.styles} 5 inputStyles={this.inputStyles} 6 v-model={this.inputValue} 7 value={this.value}//注意这里要加上value={this.value},否则在输入字母时会出现input组件中的value是inputEvent的问题!为什么? 8 disabled={this.disabled} 9 validate={this.validate} 10 onInput={this.handleInput} 11 > 12 <div slot="prepend" onClick={this.minus}> 13 - 14 </div> 15 <div slot="append" onClick={this.add}>+</div> 16 </z-input> 17 ); 18 },
4.其他待发现
5.能不用jsx就不用。