一、使用vuex保存的数据,在通过路由跳转而使页面发生变化时,store中的数据并不会丢失,所以在路由跳转回来的时候数据依然存在并展示。但是如果一个页面中还有其他小组件,小组件也使用了vuex存储数据,当路由跳转此页面时,小组件中的数据虽然没有丢失,但是却不展示。
二、axios携带参数时,params与data的区别
1.data参数适用于 post、put、patch请求,使用data时url中不会携带参数,data是将参数添加到请求体(body)中
2.params参数适用于get请求,params将参数添加到url的请求字符串中,因此使用params时url中会携带参数
三、数组的一些方法
1.filter()
官方解释:filter()
方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
个人理解:filter()方法会返回一个新的数组,并且应该传递一个函数作为参数,它会遍历数组中的每一项,满足函数返回值条件的某项会被返回为一个新的数组。
举例:
<script>
const arr = [1,2,3,4,5,6]
const newArr = arr.filter(it=>it<4)
//上面的代码完整写法如下
/*const newArr = arr.filter(it=>{
if(it<4) return true
})*/
console.log(newArr); // [1,2,3]
</script>
filter()方法主要用于对服务器返回的数据或将要给服务器传递的数据进行一些处理,注意它要返回新的数组。
2.every()
官方解释:every()
方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。
个人理解:every()方法返回一个布尔值,应该传递一个函数作为参数,遍历数组的每一项,当所有项都满足函数返回值的条件时,返回ture,否则返回false。
举例:
<script>
const arr = [1,2,3,4,5,6]
const res1 = arr.every(it=>it<6)
const res2 = arr.every(it=>it<7)
//上面的代码完整写法如下
/*const res1 = arr.every(it=>{
//如果每一项都小于6,返回true
if(it<6) return true
})
const res2 = arr.every(it=>{
//如果每一项都小于7.返回true
if(it<7) return true
})*/
console.log(res1); // false
console.log(res2); // true
</script>
every()方法可以返回一个满足条件的布尔值,filter()方法可以把为真的某一项返回为新的数组,所以every()方法和filter()方法混合使用可以有意想不到的收获。
3.some()
官方解释:some()
方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
个人理解:some()方法与every()方法可以说是相反的两个,some()方法指,当数组中只要有一项(或者多于一项)满足函数返回值的判断条件,就会返回ture,所有都不满足才会返回false。
举例:
<script>
const arr = [1,2,3,4,5,6]
const res1 = arr.some(it=>it<2)
const res2 = arr.some(it=>it<0)
//上面的完整写法如下
/*const res1 = arr.some(it=>{
//如果有满足小于2的返回true
if(it<2) return true
})
const res2 = arr.some(it=>{
if(it<0) return true
})*/
console.log(res1); // true
console.log(res2); // false
</script>
4.map()
官方解释:map()
方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。
个人理解:map()方法会返回一个新数组,其参数是一个函数,数组的每一项都去调用一下参数函数的内容,然后作为新的返回值返回,组成一个新的数组。
举例:
<script>
const arr = [1,2,3]
const newArr = arr.map(it=>it*2)
//上面的完整写法
/*const newArr1 = arr.map(it=>{
return it*2
})*/
console.log(newArr1); //[2,4,6]
const newArr2 = arr.map(it=>{
return {
a:it
}
})
console.log(newArr2); //[{a:1},{a:2},{a:3}]
</script>