Select 选择

使用指南

在 index.json 中引入组件

  1. {
  2.   "usingComponents": {
  3.     "zan-select": "/packages/select/index"
  4.   }
  5. }

代码演示

  1. <zan-select
  2.   items="{{ items }}"
  3.   checkedValue="{{ checkedValue }}"
  4.   activeColor="{{ activeColor }}"
  5.   bind:change="handleSelectChange"
  6. />
  1. Page({
  2.   data: {
  3.     items: [
  4.       {
  5.         value: '1',
  6.         // 选项文案
  7.         name: '选项一',
  8.       },
  9.       {
  10.         value: '2',
  11.         name: '选项二',
  12.       },
  13.     ],
  14.     checkedValue: '选项一',
  15.     activeColor: '#ff4443'
  16.   },
  18.   methods: {
  19.     handleSelectChange({ detail }) {
  20.       console.log(detail);
  21.     }
  22.   }
  23. });

具体参数

参数 说明 类型 默认值 必须
items select 显示各个项的配置 Array -
checkedValue 高亮的 item 的 value 值 String -
activeColor Select 高亮颜色 String #ff4444

items 具体格式如下

  1. {
  2.   items: [
  3.     {
  4.       // 选项选中时，代表的选中值。会以此作为唯一值，判断是否选中
  5.       value: '1',
  6.       // 选项的文字描述
  7.       name: '选项一',
  8.     },
  9.     {
  10.       value: '2',
  11.       name: '选项二',
  12.     },
  13.   ]
  14. }

Select 选择 - 图1
微信扫一扫

原文:

https://www.youzanyun.com/zanui/weapp#/zanui/form/select