vue-cascader-zcy

2.0.4 • Public • Published

vue-cascader-zcy

a vue component of cascade selecto for pc

pc端级联选择器(>=vue2.0)

使用方法

npm安装

npm install vue-cascader-zcy
import VueCascader from 'vue-cascader-zcy'
Vue.use(VueCascader);

Quickstart

<template>
    <div class="select-item">
        <input class="sct-ipt" @click="showCascader" v-model="sct_demo" readonly>
        <sny-cascader
            ref="cascader"
            v-model="adrList"
            label-name="name"
            value-name="id"
            other-value-name="cost"
            child-name="childList"
        :options="adrOptions"
        @change="sctDone">
    </sny-cascader>
</div>
</template>

<script>
    export default {
    data() {
    return {
    sct_demo: "",
    options: "json对象",
};
},
    components: {
    VueCascader
},
    methods: {
    showCascader() {
    this.$refs.cascader.showSctList();
},
    sctDone(obj) {
    const { value, label, otherValue } = obj;
}
}
};

</script>

属性

名称 类型 默认值 是否必填 说明
options Object - true 级联选择数据对象
labelName String - false 文字字段名称
valueName String - false value字段名称
childName String - false 子节点字段名称
otherValueName String - false 需要其他值的属性名

方法

名称 说明 默认值
show 通过this.$refs.cascader.showSctList()显示级联选择器
change 通过@change监听选择完毕后的回调方法

Readme

Keywords

Package Sidebar

Install

npm i vue-cascader-zcy

Weekly Downloads

1

Version

2.0.4

License

ISC

Unpacked Size

71.7 kB

Total Files

6

Last publish

Collaborators

  • sunny_z