# gg-search 搜索

gg-search

搜索

script 中引用组件

若使用uni-app的 easycom 引入方式,则无需在script中重复引用

import ggSearch from '@/components/gg-search/gg-search.vue'
export default {
    components: {ggSearch},
}
1
2
3
4

template 中使用组件

<gg-search v-model="formData.name" @search="onSearch">
    <!-- 左侧预留内容插槽 -->
</gg-search>
1
2
3

script

export default {
    data() {
        return {
            formData: {
                name: ""
            }
        };
    },
    methods() {
        /* 监听点击搜索按钮并获取搜索框内容 */
        onSearch (e) {
        console.log('搜索框内容:'+e);
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 属性说明

属性名 类型 默认值 说明
v-model String - 双向绑定输入框数据
placeholder String - 占位符内容
onSearch Function - 点击搜索触发事件
disableRealTime Boolean false 是否禁止实时更新v-model

# 事件说明

事件名 事件说明 返回参数
search 点击搜索触发事件 输入框内容

# 插件预览地址