vue-总结

工程化（webstorm+java）

ES6
Node.js平台+npm(包管理工具)。
webpack：打包工具

Vue全家桶：
（1）vue-cli：脚手架，快速搭建Vue项目。
（2）vue-router：路由管理。
(3) vuex：状态管理。
（4）vue-resource（axios）：调取接口。

二、常用的DOS命令：DOS（磁盘操作系统）
1、如何打开DOS操作界面：开始 | cmd。
2、DOS的提示符：>
3、DOS的术语：
（1）盘符：为硬盘分区设置的字母符号（C盘）。
（2）目录：相当于windows操作系统中的文件夹。
（3）路径：一些列目录结构组成的字符串。
4、基本操作：
（1）进入到指定的盘符：d: <回车>
（2）查看当前路径的目录结构：dir <回车>
（3）进入目录：cd 目录名 <回车>
（4）返回上一目录：cd…
（5）返回当前盘符的根目录：cd
（6）清除屏幕：cls
（7）新建目录：md 新目录名
（8）删除空目录：rd 目录名

键盘码/键盘别名

淘宝镜像：cnpm

npm install cnpm -g --registry=https://registry.npm.taobao.org

yarn：

（1）用npm安装yarn：npm install yarn -g
（2）创建package.json文件：yarn init
（3）安装第三方模块：yarn add 模块名
                    yarn add 模块名 --dev
    （4）卸载第三方模块：yarn remove 模块名
（5）安装所以模块：yarn | yarn install

安装webpack 4：

（*）npm install webpack --save-dev
（*）npm install webpack-cli --save-dev
npm install webpack-dev-server --save-dev
webpack的配置文件：webpack.config.js
var path=require(‘path’);
module.exports={
  entry:’./src/main.js’,
  output:{
    path:path.join(__dirname,’dist’),
    filename:‘bundle.js’
    }
}

算法一：冒泡法排序

var a=[15,20,1,6,9,13,55,3,24,33];
var t;
for(var i=0;i<a.length-1;i++){
  for(var j=i+1;j<a.length;j++){
     if(a[i]>a[j]){
       t=a[i];
       a[i]=a[j];
       a[j]=t; 
     }
  }
}

算法二：数组去重

var x=[1,3,6,20,1,1,55,6,1,24,33];
for(var i=0;i<x.length-1;i++){
  for(var j=i+1;j<x.length;j++){
    if(x[i]==x[j]){
      x.splice(j,1);
      j--;
    }
  }
}
document.write(x)

计算属性和侦听属性

一.计算属性：computed
当计算属性的依赖发生变化时，计算属性会自动重新计算
在一个Vue实例中，可以引用另一个实例的计算属性
Vue实例名：计算属性名

二、侦听属性：watch
1、侦听属性必须是data数据区的变量。
2、工作原理：被侦听的变量发生变化时，执行侦听属性所对
应的函数
3、如何让侦听属性的函数在页面加载时立即执行：
利用immediate属性，该属性默认值为false，取值为true

侦听vue商品管理系统分页

创建一个新数组-监听：cataArray:[]
利用属性进行监听：watch{}
shuArray：原数组
pageSize：初始页面的个数

  watch:{
        //  侦听数组
        currentPage(newVal,oldVal){
        //把原数组里面的值赋给新数组
           this.cataArray=this.shuArray.slice((newVal-1)*this.pageSize,newVal*this.pageSize)
        },
        // 侦听原先数组
        shuArray(newVal,oldVal){
           this.cataArray=newVal.slice((this.currentPage-1)*this.pageSize,this.currentPage*this.pageSize)
        }

      }

组件分发机制–插槽技术

1、单个插槽：
（1）单个组件插槽
（2）需要在插槽中显示内容必须书写在组件形成的标记对内部。
（3）插槽和props的区别：
props只能传递数据类型允许的数据。
插槽可以传递各类数据，也可以传递DOM结构。
2、多个插槽：
在组件内部书写的任意内容会出现在每一个插槽中。
3、具名插槽：
（1）为插槽设置一个名字：
（2）使用插槽：

includes()
includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。