一些VUE中开发使用方法

首先最常用的应该是对数组、字符串、对象的一些操作。因为我们经常涉及到增删改查，所以对数组的操作比较多。
一、列举一些数组的一些常用方法：

arr.push()在数组的末尾添加;
arr.unshift()在数组的开头添加;
arr.splice(index); 表示删除数组索引为index及index之后的元素；这是传入一个参数；
arr.splice(index,1)  表示从索引为index开始删除，一共删除一个；这是传入两个参数；
arr.splice(index,1,data) 表示从索引为index开始删除，一共删除一个；然后再从index的位置添加data；这是传入三个参数；
arr.pop();删除数组的最后一项;
arr.shift();删除数组的第一项;
arr.slice(index,j);表示截取数组从索引为index到j中间的元素；
arr.indexOf(data);可以去判断data在数组中最后一次出现的位置索引；可以去判断当前数组中有没有这个值；
arr.sort();可以对数组进行排序；不传参数，数组元素就会按照ASCII字符顺序进行排序；
arr.sort( (a,b)=> a-b ) /arr.sort( (a,b)=> b-a ); 这个参数我们叫做比较函数，进行正序或者倒叙排序；
还可以对数组对象内的数据进行排序;
arr.sort((a,b)=>{ return  a.num - b.num });
...new Set(arr);对数组进行去重，不过去重后会改变它的类型，要在转为数组用Array.from；
arr.join(',') ;接收⼀个参数，即字符串分隔符，返回包含所有项的字符串;数组转字符串；
一般处理的数据都是数组对象格式的，数据量过大，就要对数组进行循环；
arr.forEach( item=>{} );
for(var i=0; i<arr.length; i++){};
我一般常用这两种循环；
arr.filter() 对数组每⼀项都运⾏传⼊的函数，函数返回true的项会组成数组之后返回;
arr.map() 对数组每⼀项都运⾏传⼊的函数，返回由每次函数调⽤的结果构成的数组;

二、 对对象进行操作

Object.assign(obj1,obj2,obj3);对象进行合并，对象里相同的属性会覆盖；
Object.keys() ；返回对象所有属性名;
Object.values(); 返回对象所有属性值;
Object.entries(); 返回多个数组，每个数组是 key–value;
在vue中，我们想在方法中给对象添加值时，需要用到$set()方法去赋值，第一个参数是要添加的对象，第二个参数是要添加
的属性名，第三个参数是要添加的属性值;
this.$set(object, "objectname", objectdata);

三、 对字符串的操作

string.replace(''需要替换的字符串'' , ''新字符串'');  这个只替换第一个查找到的字符;
string.replace(/需要替换的字符串/g , ''新字符串'');  这个全局替换查找到的字符;
string.charAt(index); 返回字符串下标为index的字符;
string.charCodeAt(index); 返回字符串下标为index的字符的Unicode 编码；
string.indexOf( 's' ); 会在字符串中查找 's'第一次出现的位置，并返回下标；不存在会返回-1，可以方便去进行判断；
string.includes( 's' ); 会查找字符串中是否包含's',返回一个布尔值；
string.slice(i,j);会从字符串下标为i开始，截取到下标为j；
string.split(','); 将字符串根据参数分割为数组；
string.substring(i); 从字符串下标为i开始截取后面的字符；如果传两个参数，会截取两个参数中间的值；

四、父子组件的调用以及传参 

 首先是定义组件，然后再引入组件 import heat from '../components/heat.vue' 然后再注册组件
components: { heat  },  就可以再页面中使用了  <heat></heat>
父传子;父组件是通过props属性给子组件通信的；数据是单向流动 父—>子 （子组件中修改props数据，是无效的，会有一个红色警告）；
在父组件的子组件标签中使用自定义属性,写入要传递的数据 <heat :data="data"></heat> ；在子组件中使用props来接受数据，接受的数据可以是数组也可以是对象；
子传父；子组件通过$emit触发父组件上的自定义事件，发送参数；子组件在方法中使用this.$emit("事件名",'传递的参数')；在父组件中的子组件标签上自定义事件<heat @父组件定义事件名="子组件的事件名"></heat>然后在方法中调用，在方法中用参数来接受传递过来的数据； 

五、页面缓存 

 例如，列表页面进去详情页后，从详情页返回保留页表页的位置；这就要用到页面缓存

keep-alive；

在App.vue中添加

<keep-alive>

        <router-view />

</keep-alive> 

然后在路由页面设置

export default new Router({

  routes: [{
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        keepAlive: true // 该路由会被缓存
      }
    },
    {
      path: '/ss',
      name: 'ss',
      component: Ss,
      meta: {  keepAlive:false // 该路由不会被缓存，不需要缓存的时候该属性可以不用写}
     }]
})

这个时候就需要在App.vue中去判断一下 

//在App.vue 
  <keep-alive>
      <router-view v-if="$route.meta.keepAlive">
      </router-view>
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive">
    </router-view>

 keep-alive有三个参数；

• include - 字符串或正则表达式。只有名称匹配的组件会被缓存。
• exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存。
• max - 数字。最多可以缓存多少组件实例

被包含在 keep-alive 中创建的组件，会多出两个生命周期的钩子: activated 与 deactivated

 activated

在 keep-alive 组件激活时调用

deactivated

在 keep-alive 组件离开时调用

 

............还在持续更新整理中