微信小程序基础03--常用组件

重点讲解⼩程序中常⽤的布局组件text,button,image,navigator,icon,swiper,radio,checkbox等

view

代替 原来的div标签

 <viewhover-class="h-class"> 点击我试试  </view>

text

<text selectable="{{false}}" decode="{{false}}">  普 通 </text>

image

默认宽320px,高240px

swiper

滑块视图容器。其中只可放置swiper-item组件，否则会导致未定义的行为。
默认宽100%，高150px;

navigator

页面链接。相当于原来的a标签。但是navigator是个块级元素，默认换行。
一般使用api方法来进行跳转。open-type属性默认的navigate无法跳转到tabbar界面。

rich-text

富文本标签

可以将字符串解析成 对应标签，类似 vue中v-html功能.
nodes属性接受标签字符串/对象数组。

button

按钮

使用开放能力，微信客服时，需要到微信公众平台添加客服微信号。有些能力是需要企业资质的小程序主体，比如获取用户的手机号码，否则会提示该appid没有权限。





开放能力

icon

图标。

组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px)。

radio

单选框

checkbox

复选框

常用组件库

原生组件样式比较简单，一般会使用css进行修饰，或者直接引入第三方的组件库，常见的有vant,colorui等。

附上链接：
vant: https://vant-contrib.gitee.io/vant-weapp
colorui:https://www.color-ui.com/

可扫码体验