微信小程序学习(10)-button控件

button控件学习

1.button属性

2.size和type属性对button的影响

size属性的默认值为default，type属性的默认值也为default，如果值为default时，该属性可以省略；

 size属性为default 

 size属性为mini 



 size属性为default 

 size属性为mini 



 size属性为default 

 size属性为mini 

3.plain属性对按钮的影响

 size属性为default 

 size属性为mini 






 size属性为default 

 size属性为mini 






 size属性为default 

 size属性为mini 



补充:如果plain属性的值为false的时候要不省略，要不通过.js文件中的值，否则会有问题

 size属性为default 

 size属性为default 

 size属性为mini 

//.js中定义的变量
data: {
    plain: false
  },

4.disable属性对按钮的影响

 size属性为default 

 size属性为mini 

该属性的设置注意点与plain相同，参见plain属性图片上的红色强调字体

5.loading属性对按钮的影响

 没有loading的 

 有loading的 

6.注意事项

通常按钮的属性都通过.js文件定义变量来修改，这样便于按钮交互时实时更新按钮状态，提示用户

data: {
    defaultSize: 'default',
    primarySize: 'default',
    warnSize: 'default',
    disabled: false,
    plain: false,
    loading: false
  },

在代码用引用变量

 default 
 primary 
 warn