评论

drop-down --下拉筛选菜单,多平台测试通过,不支持的平台暂未测试

drop-down --下拉筛选菜单,多平台测试通过,不支持的平台暂未测试 组件内部使用scss进行书写样式,主题色是使用根目录下的uni.scss中的 $uni-color-primary,使用HB

drop-down --下拉筛选菜单,多平台测试通过,不支持的平台暂未测试

去 github 给个免费的Star吧!!

参数

可选参数属性列表

|参数名|说明|类型|是否必填|默认值|

|----|----|----|----|----|

|filterData|筛选列表|Array|是|[]|

|childName|子级菜单字段名|String|否|submenu|

|fileds|显示字段|String|否|name|

|isChild|返回结果时是否一并返回子菜单|Boolean|否|false|

|autoStow|选择完成是否自动收起菜单,仅列表模式有效|Boolean|否|true|

|resetStow|重置参数后自动收起菜单|Boolean|否|false|

|confirm|菜单收起时返回赛选结果|Function|否|[]|

filterData 格式和默认值设置

在 filterData 筛选列表中为需要选中的项添加 checked: true 即可,checked 不存或 checked:false 则不选中


const filterData = [{

	name: '价格',

	type: 'radio',

	submenu: [{

		name: '200-300',

	},{

		name: '500-600',

		checked: true //默认选中

	}]

}]

使用

从uniapp插件市场导入


<template>

	<view class="index">

		<drop-down :filterData="filterData" @confirm="confirm"></drop-down>

	</view>

</template>


<script>

	import data from '@/common/data.js'; //筛选菜单数据

	export default {

		data() {

			return {

				filterData: [],

			};

		},

		onLoad() {

			this.filterData = data;

		},

		methods: {

			confirm(e) {

				// 返回值为一个数组

				console.log('eeee', e);

			},

		},

	}

</script>

描述

组件内部使用scss进行书写样式,主题色是使用根目录下的uni.scss中的 $uni-color-primary,使用HBuildX创建uniapp项目之后根目录下会自动创建uni.scss文件。

如需修改主题色

第一步:可以使用快捷键 Ctrl+F 输入 $uni-color-primary。

第二步:选择本插件目录名称 drop-dowm 全部替换即可。

GitHub

git给个免费的Star吧!!

Link

https://github.com/EarlySummer2018/drop-down.git

最后一次编辑于  2022-06-16  
点赞 0
收藏
评论
登录 后发表内容