背景：前端接收后端返回的list

//例如：
let _list = [{"name":"小一", "age":10, "id":1},{"name":"小二", "age":15, "id":2},{"name":"小三", "age":9, "id":3}]
方案一，直接在HTML代码中使用v-for、Object.key、Object.value来渲染页面
 
<template>
	<div v-for="map in _list">
		<ul v-for="(_key,index) in Object.key(map)" :key="index">
				{{_key + " : " + Object.value(map)[index]}}
	</div>
</template>
注：如果是使用axios进行异步请求，需要注意的是数据还未返回，界面就已经开始渲染，导致此时的_list=[]，前端界面控制器会出现错误提示，原因是Object.key(obj)和Object.value(obj)中的obj不能为null或undefined。
 
方案二，在js部分对集合进行处理，使用到Object.entries枚举方法
 
	let newList = [];
	let _length =  null != _list ? _list.length : 0;
	for(let i = 0; i< _length; i++){
		Object.entries(_list[i]).forEach( label=>{
			let [_key , _value] = label;
			newList.push({_key , _value});
		});
	this._list = newList;
前端html代码稍微发生变化
 
<template>
	<div v-for="map in _list">
				{{map._key + " : " + map._value}}
	</div>
</template>
这样就避免了后端数据未发送到前端时，前端进行渲染，导致Object.key等方法报错的问题。
                    背景：前端接收后端返回的list集合，并将该集合展示在页面。//例如：let _list = [{"name":"小一", "age":10, "id":1},{"name":"小二", "age":15, "id":2},{"name":"小三", "age":9, "id":3}]方案一，直接在HTML代码中使用v-for、Object.key、Object.value来渲染页面&lt;template&gt;	&lt;div v-for="map in _list"&gt;		&lt;u
				
需求：根据主键id来找到对应的数组下标
原本的方法是使用for循环遍历该数组，变量 i 就是下标，问题在于，如果有多重for循环，就会导致性能大大下降，数据也容易出错
因此使用map，让数组（原本是list）变成一个map集合（key-value形式），把主键id当做key，下标当做value，一一对应，需要的时候直接使用map.get(key)就可以获取到对应的value
1.在data{}中先定义一个map全局变量
2.在数据回显或有全部数据的地方把数组list变成map
该例子数据结构是[｛｝]，所以有2个for循环 item也是[｛｝]结构
这里的item[j].compon
   如题，最近在使用vue开发页面过程中，遇到需要表格中，使用v-for遍历map获取对应的key和value。
  首先来展示优秀后端(没错，也是在下)处理返回的数据JSON格式(返回数据已脱敏处理，请放心食用)
{"total":1,"rows":[{"sysRightMap":{"10":"值A,值B","40":"值1,值2"}}]}
页面需要通过v-for in 的方式遍历取出返回对象中的sysRightMap对象里面的值，分别得到对应的key和value，
页面...
				
最近通过对对象相关知识的深入学习，我发现对对象的遍历主要分为两种情况，一种是在页面中遍历，另外一种是在方法中遍历对象，现在我们就从这两种情况分别来遍历对象获取对象的key和value。
情况一：在页面中遍历对象获取对象的键和值
定义一个变量
  obj:object={a:1,b:2,c:3};//用于在页面中调用
在页面中使用v-for遍历出对象的key和value
        获取对象的key和value
vue中定义的map对象 map : { name : 'xxx' }
接口回显map格式的数据 data :{ key : value}
都可以通过以下方式拿到key和value的值
for(const key in map){
console.log("key名称是："+key+",key的值是："+map[key])
				
场景：购物车增加商品数量同时更新bridge标志上的总商品个数，如果只是加上当前变化后的数量的话则之前原有的数量会被重新添加一遍造成计算错误。因此要减去变化前的数量才能得到添加的数量。
方法一： 直接watch监听data的数据
watch: {
a (now,old) {
console.log(now,old)
old为旧的值now为更新后的值
方法二：自定义指令
通过自定义指令将更新前的值绑定到对应自定义指令的元素的dataset上然后在vue文件里面通过ref获取到元素来获取旧的值
自定义指令就不多说了前面有写过以前相关的博客了这里直接上代码
自定义指令要新建一个js文件并引
const myMap = new Map();
myMap.set('key1', 'value1');
myMap.set('key2', 'value2');
// 在Vue组件中获取Map中的值
export default {
  data() {
    return {
      myMap: myMap
  mounted() {
    // 获取key1对应的value值
    const value = this.myMap.get('key1');
    console.log(value); // 输出：value1
在上面的例子中，我们首先创建了一个Map对象`myMap`，并将一些键值对存储在其中。然后，在Vue组件中，通过`data`选项将`myMap`作为数据属性添加到组件中。在`mounted`生命周期钩子函数中，我们使用`get()`方法来获取`myMap`中键为'key1'的值，并将其存储在变量`value`中。最后，我们将`value`输出到控制台。
通过这种方式，你可以在Vue组件中获取Map中的值。
 <dependency>
            <groupId>org.bytedeco.javacpp-presets</groupId>
            <artifactId>ffmpeg-platform</artifactId>
            <version>4.1-1.4.4</version>
        </dependency>
[/code]
但是转出来的还是一个同等时长的纯黑视频
                vue使用router.addRoutes实现动态路由配置
                    Litluecat: 
                    前两周的需求，太酷啦
                vue使用router.addRoutes实现动态路由配置
                    小老弟，写得不错，受益匪浅
                sessionStorage不能跨窗口取值
                    突破自己，琳琅天上: 
                    FW 文章，下次不要写了