封装el-cascader 省市区街道 4级联动 本地离线数据,带数据
【封装el-cascader 省市区街道 4级联动 本地离线数据,带数据】今天找到了大半天,没找到合适的 vue el-cascader 省市区街道4级联动的数据,并且支持维护修改的。
于是自己做了一个。
代码非常简单,重要的符合这个格式的数据,这就是我这个懂后端程序员的优势了。
>
import citydata from "./data.js";
export default {
name: "areaCascader",
components: { citydata },
data() {
return {
selectedOptions: [],
cityList: citydata.AREA_LIST,
optionProps: {
value: "id",
label: "name",
children: "child",
},
};
},
mounted() {},
methods: {
handleChange(value) {
if (value.length > 0) {
// 获取当前选中节点
let checkNode = this.$refs["cascader"].getCheckedNodes();
// 将当前选中节点数据和当前路径数组返回给父组件
this.$emit("getData", checkNode[0].data, checkNode[0].pathLabels);
} else {
this.$emit("getData", {}, []);
}
},
},
};
如果找不到资源,就留下邮箱,我发给你。
推荐阅读
- 2020-04-07vue中Axios的封装和API接口的管理
- 基于|基于 antd 风格的 element-table + pagination 的二次封装
- python自定义封装带颜色的logging模块
- jQuery插件
- 使用Promise对微信小程序wx.request请求方法进行封装
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- vue.js|vue中使用axios封装成request使用
- Objective-c
- Swift学习笔记(三)Alamofire二次封装
- js之策略模式