美文网首页Weex
Weex——input

Weex——input

作者: 阿凡提说AI | 来源:发表于2017-01-27 20:03 被阅读140次

    概述

    input 标签用于创造一个从用户那边获取数据的交互动作。渲染一个特定的图片,并且它不能包含任何子组件。input组件的效果变化依赖于变量类型的属性设置,比如text,password,url,email,tel等。

    注意: width和height需要指定,否则会不工作。

    注释:input不支持普通的点击事件click.请使用监听input或change事件代替。

    属性

    type:<字符串>属性,控制组件显示的类型。如果没有特定,默认值是text。可以设置的值有:text,password,tel,email,url等,和w3c标准一致。
    value:<字符串>属性,控制组件的值。
    disabled:<布尔值>属性,用于使得组件不可用。实际使用中,click事件在有disabled属性值在的情况下不会执行。
    autofocus:<布尔值>属性,让你可以设置当页面加载时,input是否自动获取焦点。
    

    样式

    placeholder-color : 占位符的颜色,默认是#999999。
    文本样式
    支持color样式。
    支持font-size样式。
    支持font-style样式。
    支持font-weight样式。
    支持text-align样式。
    基础样式
    支持 flexbox 相关样式
    支持 box 模型相关样式
    支持 position 相关属性
    支持 opacity,background-color 等。

    事件

    input:该元素改变的值
    change:改变事件是当组件提交的值已经改变的时候用户中断结果。经常跟在<blur>事件之后。
    focus:组件获取焦点。
    blur:组件失去焦点。
    支持 appear / disappear 事件。查阅基本事件
    注意:input不支持基础事件click.请用监听事件input或者change事件代替。

    事件对象的参数

    对于 input和change事件:
    value:组件事件发出的值。
    <timestamp>:事件的时间戳。
    对于focus和blur事件:
    <timestamp>:事件的时间戳。
    

    例子

    <div>
      <input
        type="url"
        autofocus="true"
        placeholder="..."
        value="http://alibaba.github.io/weex/"
        style="placeholder-color: #666666;">
      </input>
    </div> 
    

    相关文章

      网友评论

      • Gizone_iac:placeholder-color 这个值设置了无效 有试过吗?
        Gizone_iac:@张璠 是的。 但是在使用Weex-input 组件时还是发现了一些问题。 例如在Android中 ,给Input 默认赋值 然后在此基础上删除后输入 并未触发 v-model 的change事件。
        阿凡提说AI:2017年以后现在基本都用vue.js弄了,这篇文章有点老了

      本文标题:Weex——input

      本文链接:https://www.haomeiwen.com/subject/dfofittx.html