vue+element ui项目总结点(四)零散细节概念巩固如vue父组件调用子组件的方法、拷贝数据、数组置空问题 等

时间:2021-09-23 16:33:11

vue config下面的index.js配置host: '0.0.0.0',共享ip (假设你的电脑启动了这个服务我电脑一样可以启动)
-----------------------------------------------------------------------
回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当那个函数执行完之后,再执行传进去的这个函数。这个过程就叫做回调;
回调,回调,就是回头调用的意思。主函数的事先干完,回头再调用传进来的那个函数。
-----------------------------------------------------------------------
例子:
点击按钮获取数组中大于 18 的所有元素。
<button onclick="myFunction()" id="demo">点我</button>
var ages = [32, 33, 16, 40];

function checkAdult(age) {
     return age >= 18;
}

function myFunction() {
     document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}

语法:
array.filter(function(currentValue,index,arr), thisValue)
filter() 不会对空数组进行检测。
filter() 不会改变原始数组。
-----------------------------------------------------------------------
vue计算属性(computed)会有缓存;调用的实际是属性的get方法;methods方法不会有;
-----------------------------------------------------------------------
数组置空问题
let arrayList = [] or arrayList.length = 0 ;//不是靠谱的做法;
this.arrayList.splice(0, this.arrayList.length);//首选
-----------------------------------------------------------------------
document.getElementById("xxx").focus(); //光标自动定位到当前文本框
-----------------------------------------------------------------------
vue父组件调用子组件的方法
<Father/>
<Child ref="myChild"/>
假如子组件Child里面有一个方法叫 getName(){...},
父组件调用形式为this.$refs.myChild.getName();
-----------------------------------------------------------------------
输入框限制只能输入小数点并且小数点后保留4位小数
oninput="value=value.replace(/[^\d\.]/g,'').replace(/^(\d*(\.\d{0,4})?).*/,'$1')"
-----------------------------------------------------------------------
拷贝数据
deepCopyData(data) {
     return JSON.parse(JSON.stringify(data));
},
截去数组最后一条数据;
cutArrayLength(arr) {
     return arr.slice(0, -1);
},