问题一、 我需要渲染数组A,并根据 B数组中是否存在A中,给A添加 选中状态sel。

经过很焦虑的研究后,寻求帮助得到答案。

1、初始化数据时 A添加属性flag(bool)标识,如果B中存在A中某个 就 flag=true。

2、渲染页面时 使用关键 指令:class  (v-bind)  ,

{'select-tag': item.flag}解析:  当 item.flag 为 true时输出  select-tag
<div class="block-tags" :class="['',{'select-tag': item.flag}]" v-for="(item,index) in defaultType" :data-id="item.id">
{{ item.name }}
</div>

总结:   实战验实力

问题二、异步获取数据后 获取到 B对象,于是乎我把    A = B , C = B ;

结果:  在使用当中,一旦 修改 ABC任意值,三个都会被修改。  这真是无语了。

最终解决方案:

使用了  JS:Object.assign         Object.assign(target, ...sources)

这个简直厉害了,   A = Object.assign([], B);   这样就解决问题了。  

一级棒~!

Vue 框架中遇到的诀窍的更多相关文章

  1. 如何在vue框架中兼容IE

    IE目前已经放弃了自己的独特化,正一步步迎入互联网的主流怀抱.但迫于有用户存在,还是要兼容到IE8,9, 以上. 下面聊一下如何在vue框架中兼容IE 1.首先在index.html <meta ...

  2. vue框架中props的typescript用法

    vue框架中props的typescript用法 在vue中使用typescript时,需要引入vue-property-decorator库来兼容格式. javascript写法 Vue.compo ...

  3. vue框架中的日期组件转换为yyy-mm-dd格式

    最近在用vue框架写一个app,这个是用到的日期格式转换,把下面的标准格式转换为字符串连接格式

  4. yarn 在Vue框架中的常用命令

    初始化项目 yarn add init 安装vue yarn add vue 安装webpack,webpack-dev-server(是一个小型的Node.js Express服务器) yarn a ...

  5. 在Vue框架中使用百度地图

    1.首先在index.html中引入百度地图 <script type="text/javascript" src="http://api.map.baidu.co ...

  6. vue框架中实现今天昨天前天最近时间

    点击下拉出几个选项,根据日期不同来过滤数据.看图--(忽略小梨子,这是日常练手页面) (element ui) 点击today-当天日期 点击last three days 点击custom,并且实现 ...

  7. vue框架中什么是MVVM

    前端页面中使用MVVM的思想,即MVVM是整个视图层view的概念,属于视图层的概念. MVVM是前端视图层的分层开发思想,将页面分成了Model, View,和VM:其中VM是核心,因为VM是V和M ...

  8. vue框架中的Axios封装

      function axios(options) {     let promise = new Promise((resolve, reject) => {         var xhr ...

  9. Vue框架H5商城类项目商品详情点击返回弹出推荐商品弹窗的实现方案

    需求场景: 非推荐商品详情页返回的时候弹出弹窗推荐商品,点击弹窗按钮可以直接访问推荐商品: 只有直接进入商品详情页返回才会弹出推荐商品弹窗: 每个用户访问只能弹一次(除非清除缓存). 需求分析: 1. ...

随机推荐

  1. Python3基础 if else 格式 输入一个整数并判断是8吗

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  2. 三羊献瑞|2015年蓝桥杯B组题解析第三题-fishers

    三羊献瑞 观察下面的加法算式: 祥 瑞 生 辉 三 羊 献 瑞 三 羊 生 瑞 气 (如果有对齐问题,可以参看[图1.jpg]) 其中,相同的汉字代表相同的数字,不同的汉字代表不同的数字. 请你填写& ...

  3. POJ1144 Network(割点)题解

    Description A Telephone Line Company (TLC) is establishing a new telephone cable network. They are c ...

  4. [web开发] - 一些注解的解释

    @WebServlet替代了原本web.xml中配置的url拦截 可以直接在servlet上添加该注解,加入("/hello")类似的路径 但在controller层(Spring ...

  5. [JVM] - 不就是JVM么 JVM的继续探究

    前面几章跟着作者的脚步实现了使用Go语言查看java的.class文件源码(16进制) 复习一下: 相比Java语言,Go的访问控制非常简单,只有公开和私有两种. 所有首字母大写的类型, 结构体,字段 ...

  6. Tomcat Connector

    转自: http://blog.csdn.net/aesop_wubo/article/details/7617416 如下图所示,Tomcat服务器主要有两大核心模块组成:连接器和容器,本节只分析连 ...

  7. Mybatis配置映射文件中parameterType的用法小结

    原创: 在mybatis映射接口的配置中,有select,insert,update,delete等元素都提到了parameterType的用法,parameterType为输入参数,在配置的时候,配 ...

  8. BZOJ 2648 kd-tree模板

    学习了一下kd-tree的基本写法 http://blog.csdn.net/jiangshibiao/article/details/34144829 配合 http://www.bilibili. ...

  9. Python CSV Reader/Writer 例子--转载

    CSV(comma-separated values) 是跨多种形式导入导出数据的标准格式,比如 MySQL.Excel. 它以纯文本存储数和文本.文件的每一行就代表一条数据,每条记录包含了由逗号分隔 ...

  10. [原][OSG]深入osg函数----SceneView::cull 函数

    参考:最长一帧 先介绍几个类: osgUtil::CullVisitor:“筛选访问器” 当我们使用它遍历场景图形的各个节点时, CullVisitor 将会对每一个遇到的节点执行场景筛选的工作,判断 ...