Button按钮

在小程序中image组件,有一个宽和高,默认的一个宽是300像素,高度是240个像素左右。那么这个navigator组件,还是咱们小程序里面的页面,导航组件就类似于HTML里面的链接。

如下,先修改文本这是主色调按钮,把这个type做一下修改,等于primary。在页面上就多了一个绿色的按钮,如果希望来一个警告按钮,如下,type修改为warn:

在页面上就多了3个按钮,它们的大小就没有之前那么大了,而且这三个按钮是在一行上来进行展示的,接下来我们再看一下这个按钮的另外一个属性,就是plain。通过plain,可以在页面上选出一个镂空的按钮,就是没有背景色了但是有了一个边框线咱们去做演示复制这三个按钮来看,粘过来再加一个属性。

直接来一个属性就行,保存之后大家来看在页面上就多了三个镂空的按钮。

这一节课咱们给去介绍了一下这个按钮的三种不同用法,如果只想更改按钮的这个颜色,更改这个色调的话可以修改type等于primary或其他。可以选出主色调的按钮,或者说警告类型的红色按钮,或者说直接放一个普通的灰色按钮。如果希望来一个小尺寸的按钮,可以加一个size等于mini,如果希望渲染一个镂空的按钮,咱们可以加一个plain属性就行了。在app.js里面有一个style等于v2这么一个节点来控制这些元素的样式版本,对v2代表说最新的样式。

看这个按钮的颜色,包括它的样式都发生了非常大的改变。在微信小程序里面可以通过app.json里面的styles节点来控制组件使用新版的样式,还是使用之前旧版的样式,默认情况下,这个带了v2新版的样式,如果希望启用旧版的样式,你把这个节点给他删掉就行了。

IT赶路人

专注IT知识分享