Vuetify笔记(3):v-btn按钮和v-text-field文本

1、v-btn按钮

     在UI组件中v-btn组件是用一个material design主题和多个选项来替换标准的html按钮。任何色彩辅助类都可以用来改变背景或文字的颜色。

v-btn按钮常用属性：

（1）flat：移除按钮的背景色，布尔值类型，默认为false；
（2）icon：将按钮指定为图标——原型和平面，布尔值类型，默认为false；
（3）small：小型按钮，布尔值类型，默认为false；

【示例1】

修改
刪除

【示例2】

   
        edit
   
    
           delete
     

 

 

2、 v-text-field文本

v-text-field文本框组件用于收集用户提供的信息。

v-text-field文本框组件常用属性

（1）append-icon：在文本框后面追加一个图标，默认为String类型；
（2）counter：为输入长度创建一个计数器，如果未指定数字，则默认为25，不会应用任何验证；类型为boolean|number|string；
（3）disabled：布尔类型boolean不可见；
（4）multi-line：是否转为文本域，默认是false。文本框和文本域可以自由切换；
（5）name：字段名，表单中会用到；
（6）label：提示文字，输入框的标签；
（7）value：值。可以用v-model代替，实现双向绑定。
（8）hide-details：表示隐藏文本框底部错误信息。
（9）required：是否为必填项，如果是，会在label后加*，不具备校验功能。默认是false；
（10）rows：文本域的行数，multi-line为true时才有效；
（11）single-line：是否单行文本显示，默认是false。