前端笔记……

vuex中的存储数据
state：存储数据以及数据状态
this.$store.state.count获取存储的数据getter：计算属性在getter里面写数据处理方法this.$store.getters 获取数据vuex中的数据
mutation：同步触发事件更改vuex中state中存储数据的状态
this.$store.commit同步触发mutation中的方法存储数据//this.$store.commit(“handelMenuId”,this.menuId)
Action：异步触发事件更改vuex中state中存储数据的状态
this.$store.dispatch异步存储更改数据状态//this.$store.dispatch(“handelMenuId”,this.menuId)
module ：模块化
可以设置nameSpace:true使当前store成为可复用的模块
使用store.registerModule方法注册模块：
store.registerModule(“myModule”,{
})
注册嵌套模块
store.registerModule([“fuModule”,“ziModule”],{
})
vue中传数据
Bus.$on接收数据Bus.$emit 传数据
h5中 localStorage
localStorage.setItem(“menuId”, this.menuId); //存储 (“名字”,值)
localStorage.getItem(“lastname”); //取出 (“名字”)
localStorage.clean() 清空
es6
1.new Promise((resolve, reject) => {} // promise resolve 已定性 reject 已失败 改变状态
父子组件传值
子传父
子传父时父组件写法：
<order_detail
:isOpenDetail=“isOpenDetail”
:orderNo=“orderNo”
@changeIsOpenDetail=“changeIsOpenDetail” //父传子
></order_detail>

:名字=“数据名” :login='loginMsg'  绑定到父组件中的子组件上
data中初始化
  data(){
     return {
       loginMsg;true  //声明值
    }
  }

父传子
@changeIsOpenDetail=“changeIsOpenDetail” //父传子
this.$emit(“changeIsOpenDetail”,value);

2.object.assign 合并对象 浅拷贝
object.assign(target,obj1,obj2) //将obj合并到target

new Set()去重
//合并去重
let arr = [1, 2, 3];
let arr2 = [2, 3, 4];
let set = new Set([…arr, …arr2]);
console.log(set); // {1, 2, 3, 4}

npm包下载错误
1.使用npm cache clean --force 先清除缓存过的npm包
2.再运行npm install 命令重新下载
3.npm run dev/npm run serve 运行脚手架
4.命令
npm start 启动
npm install /cnpm install/npm install --save --lagecy-peer-deps 下载node包
npm run build 打包
git命令行

1. git冲突 commit your changes or stash them before you can merge.
   解决：
   git stash 备份当前工作区内容
   git pull 更新本地
   git stash pop 回复
2. git进入uninx编辑器
   解决:
   esc
   :q!

3、git status ----查看当前本地文件信息

4. git add * ----将所有要提交的所有修改文件放入暂存区

5、 git commit -m “更改信息备注” 一次性把暂存区的所有修改提交到分支

6、git push --------提交代码到当前分支
如果先使用 git commit 命令 无法推送，使用命令git push origin master指令分支

7. git branch 查看当前所在分支

8. git remote -v 查看当前远程库地址

JS
数组
shift() 将数组中第一个元素删除 并返回此元素的值 a.shift()
pop() 删除当前数组最后一个元素 并返回此值 a.pop()
a.sort() 正常排序为按照数组内的十进制排序,所以如果使用sort排序需要写回调函数 传两个参数 代表最 大与最小
实例
a 小 b大 a-b 从小到大
arr.sort((a,b)=>{
return a-b
})
console.log(arr)
数组去重返回重复的值
var a = [1,3,31,2,4,5,“胖”,“傻”]
var b = [56,2,4,6,8,10,“傻”]
// 数组去重
var c = a.filter(function(v){ return b.indexOf(v) > -1 })
console.log© //返回重复的值 [2,4,“傻”]
数组去重并返回拼接为新数组
//concat 拼接数组 indexOf() 检索a数组内 v的值出现的位置 返回1或-1
var e = a.concat(b.filter(function (v) { return !(a.indexOf(v) > -1) }));
js中every()与some()的区别
every()判断一个数组内每个元素都要符合，才会返回true,否则返回false
some()判断数组中只要有一个元素符合，就可以返回true
例：
var a = [1,2,3,4] var b = [4,3,2,1,0]
console.log(a.every( (i, v) => i < 3)) // false
console.log(b.every( (i,v) => i<5)) //true
console.log(a.some( (i, v) => i< 3)) //true
console.log(b.some((i,v) => i > 10)) // false
js中…三个点的作用是什么
1.合并数组
console.log([…c,d]) //[1, 2, 3, 45, 5, “6”] //… 合并数组
解构赋值
var [arr, …arr1] = [] // 解
console.log(arr) //undefined
console.log(arr1) //[] // 构
var [arr2, …arr3] = [1,2,3,4,5]
console.log(arr2) // 1 // 赋
console.log(arr3) // [2,3,4,5]
var [arr4, …arr5] = [“foo”] // 值
console.log(arr4) //foo
console.log(arr5) //undefined
3.复制数组
var z =[12,23,34]
console.log([…z]) // [12,23,34] 复制数组
4.拆分字符
console.log([…‘hello’].forEach(function (value) {console.log(value)}))
// h e ll o 获取字符串中的每个字符
js中repeat的作用
复制字符
console.log(‘x’.repeat(‘3’)) // ‘xxx’
js中padStart()和padEnd()的作用
1. padStart 在字符串开头补全字符 第一个参数为个数 第二个参数为要补全的字符串
2. padEnd 在字符串结尾补全字符 第一个参数为个数 第二个参数为要补全的字符串
例：
console.log(‘1’.padStart(10, ‘0’)) // 0000000001
console.log(‘1’.padEnd(10,‘2’)) // 1222222222
Array.of()， 用于将一组值，转换为数组。
console.log(Array.of(2,3,5,6)) // [2, 3, 5, 6]
console.log(Array.of(2).length) // 1
js中reduce()方法的使用
reduce()可以累加数组四舍五入之后的和
例：
求平均数
let aver=[12,69,180,8763];
let result=aver.reduce(function (tmp, item, index){
if(index!=aver.length-1){ //不是最后一次
return tmp+item;
}else{ //最后一次
return (tmp+item)/aver.length;
}
});
console.log(result); // 2256

发送ajax请求调用接口
KaTeX parse error: Expected '}', got '#' at position 596: …?style="color:?#̲409eff;">{keyword}`
);
console.log(res);
return res;
}
},
搜索table数据中的





Vue
1.v-modal
.lazy修饰符
v-modal.lazy 在输入框发生变化且失去焦点后触发
.trim修饰符
v-modal.trim 过滤首尾空格
.number修饰符
v-modal.number 限制只能为数字，其余格式
2.事件修饰符
示例：@click.stop @click.capture.prevent
.stop 阻止事件冒泡，相当于调用event.stopPropagation
.prevent 阻止事件默认行为，相当于调用event.preventDefault方法
.self 只触发事件本身，有阻止冒泡的效果
.once 事件只触发一次，一次后不再执行
.capture 事件的完整机制是捕获-目标-冒泡，目标往外冒泡时触发
.sync 监听prop(子传父组件)传值的数据
.keyCode 监听按键指令，需查看vue对应键码
8 —>退格键
46 —>删除 delete
13 —> 回车
9 —> tab
3，vue基础指令
v-modal v-if v-else v-for v-bind v-on v-show
4. vue双向绑定的含义
vue双向绑定通过数据劫持结合发布订阅者模式来实现，也就是说数据和页面视图同步，数据发生变化，视图也跟着变化，视图变化
apply和call区别
都是js中截取替换用法，区别是apply最多传两个参，且第二个参数必须是数组，call可以传入多个参数，因此call被广泛使用在封装接口中用以传递映射参数。