v-bind=" $attrs" || v-on="$ listeners"

使用v-bind="$attrs"，将父组件中不被认为 props特性绑定的属性传入子组件中，通常配合 interitAttrs 选项一起使用。

el-radio单选框设置 [不限]、[上限]按钮的时候与下方的el-input数据冲突

产生原因: el-radio 双向数据绑定到了form的数据A内，el-input同样也双向数据绑定到form的数据A内，两者共同调用一个数据，则会产生冲突。当自定义[上限]的时候，el-radio数值过大则不显示选中状态

解决方案：

radio和input不能公用一个数据，采用不同的数据

采用不同的数据当radio改变的时候，可以采用@change事件来进行input输入框内的数字进行重置操作，特殊类型(时间)的时候，可以进行判断，赋值为null或0

当需要进行回填数据的时候，可以采用Watch方法进行拿到值进行回填

问题：el-cascader 同时选择label和value

父组件通过属性props向下传递数据给子组件

出现问题：选择el-cascader的时候选择成功，则直接出现value值，但this.$refs.industryRef.inputValue不会及时出现框内的文字与value值不同步

解决：利用elementUI的getCheckedNodes() 方法

this.$refs.myCascader.getCheckedNodes()[0].pathLabels

可以同步出现label+value值

使用的是 compute 计算方法。get()来获取数据和set()方法

利用好 debugger调试Vue组件

基础知识回顾

Watch方法

handle就是你watch中需要具体执行的方法
deep：就是你需要监听的数据的深度，一般用来监听对象中某个属性的变化
immediate：在选项参数中指定 immediate: true 将立即以表达式的当前值触发回调：

immediate（立即处理进入页面就触发）

表单验证正则表达式

// 这是组件的代码
<el-form-item prop="mobile">
    <el-input type="text" v-model="ruleForm.mobile" auto-complete="off" placeholder="请输入手机号"></el-input>
</el-form-item>
 
// 这是rules的代码
mobile: [
    { validator: validateMobile, trigger: 'blur' },
    { required: true, message: '请输入手机号', trigger: 'blur' },
    { pattern: /^1[34578]\d{9}$/, message: '目前只支持中国大陆的手机号码' }
],

输入的url必须以http或https开头 /(http|https)://([\w.]+/?)\S/*

this.$emit("自定义事件"),然后父组件在组件中添加@自定义事件=“event” 就可以实现了

代码规范

常量命名规范: 常量声明里的单词用下划线分割，避免连续拼接例:COSTA 换成COST_A
页面元素微调，使用公共样式。
减少使用JSON.parse JSON.stringify的用法

git

尽量采用git rebase 减少使用git pull命令
- git pull --rebase = git fetch + git rebase
- git pull = git fetch + git merge
使用Conventional Commits进行约定式提交代码

01-Vue_遇到并解决问题（一）

v-bind="attrs"∣∣v−on="attrs" || v-on="attrs"∣∣v−on="listeners"