直接在数组里,改变数组来达到重新渲染页面的目的,

需要用push等数组方法,

或者$set(),或者给数组重新赋值,来改变数组引用地址

而是直接索引=

<body>
<div id="app">
<li v-for='item in students'>
<span>{{ item.name }}</span>
<span>{{ item.age }}</span>
</li>
<button @click='addStudent'>click</button>
<button @click='$set(students,3,{name:"xioaming",age:102333})'>click</button>
<button @click='Vue.set(students,3,{name:"xioaming",age:102333})'>click</button>
    </div>
<script src="../vue.js"></script>
<script>
var vm = new Vue({
el: '#app',
data: {
students: [
{name:"xioaming",age:10},
{name:"xioaming",age:101},
{name:"xioaming",age:102}
]
},
methods: {
addStudent: function(){
this.students[3] = {name:"xioaming",age:102333}//这样不能重新渲染页面
this.students.push({name:"xioaming",age:102333})
} } }) </script>

vue v-for的数组改变导致页面不渲染解决方法的更多相关文章

  1. [Q]系统环境改变导致“未注册”的解决方法

    据用户反映设置账户开机密码后显示未注册, 具体表现: 1. 重装试用版,重新获取注册申请码,发现注册申请码跟原来没有发生变化. 2. 重新使用原来的授权文件注册,但打开后显示未注册. 3. 发现“** ...

  2. vue项目初始化时npm run dev报错webpack-dev-server解决方法

    vue项目初始化时npm run dev报错webpack-dev-server解决方法 原因:这是新版webpack存在的BUG,卸载现有的新版本webpack,装老版本就好webpack-dev- ...

  3. IOS-43-导航栏标题navigationItem.title不能改变颜色的两种解决方法

    IOS-43-导航栏标题navigationItem.title不能改变颜色的两种解决方法 IOS-43-导航栏标题navigationItem.title不能改变颜色的两种解决方法 两种方法只是形式 ...

  4. 系统导出数据到excel,数据量过大(大约10W)条,导致服务器 cpu 100%解决方法

    系统导出数据到excel,数据量过大(大约10W)条,导致服务器 cpu 100%解决方法

  5. vue.js 中使用(...)运算符报错的解决方法

    vue.js 中使用(...)运算符报错的解决方法 Syntax Error:Unexpected token(XX:X) }, computed:{ ...mapGetters([ 'pageSiz ...

  6. IE8 浏览器文本模式变为杂项(quirks)页面变形的解决方法

    IE8 浏览器文本模式(document.documentMode)变为杂项(quirks)页面变形的解决方法. 正常情况下 document.documentMode 输出为8,而变为杂项之后doc ...

  7. Vue下路由History mode导致页面无法渲染的原因

    用 Vue.js + vue-router 创建单页应用,是非常简单的.使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件( ...

  8. VUE项目中使用this.$forceUpdate()强制页面重新渲染

    在使用Vue框架开发时,在函数中改变了页面中的某个值,在函数中查看是修改成功了,但在页面中没有及时刷新改变后的值,我是在使用多层v-for嵌套时出现这种问题的, 解决方法:运用 this.$force ...

  9. vue 报错 :属性undefined(页面成功渲染)

    vue 报错:Cannot read property 'instrumentId' of undefined" 相关代码如下: <template> ... <span& ...

随机推荐

  1. 对于eclipse building workspaces 慢的问题,解决方法

    在项目根目录中有个.project文件,将其中的: <buildCommand> <name>org.eclipse.wst.jsdt.core.javascriptValid ...

  2. GPG(GnuPG)入门

    GPG(GnuPG)入门 下载: https://gnupg.org/download/index.html 或者 http://www.hellopp.cn/page/5b9a1405c3f1f7d ...

  3. 安装rcssmin方法

    #安装rcssmin方法'''pip install wheelpip install rcssmin --install-option="--without-c-extensions&qu ...

  4. Ubuntu18.04下的模拟神器RetroArch

    安装 直接通过apt安装 sudo add-apt-repository ppa:libretro/stable sudo apt update sudo apt install retroarch ...

  5. iOS开发之Found a swap file by the name ".podfile.swp" owned by: Netban dated:...file name: ~N...

    Found a swap file by the name ".podfile.swp" owned by: Netban dated: Fri Mar 24 13:57:27 2 ...

  6. AYUI -AYUI风格的 超美 百度网盘8.0

    2017-03-23 19:18:43 (截止到2017-3-23 20:20:33开发结束)体验地址:  http://pan.baidu.com/s/1bX28H4 新增传输列表 ======== ...

  7. service_names配置不正确,导致dg创建失败

    service_names配置不正确,导致dg创建失败 伙伴发来消息,创建dg后,主备一直无法进行日志同步. 以下是查看过程 备库的alert日志: 2018-11-13T17:47:36.23129 ...

  8. Effective Java 第三版——64. 通过对象的接口引用对象

    Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...

  9. PHP操作二进制字节数据

    在PHP开发中大都是操作字符类数据,极为方便,但操作二进制又如何呢,下面代码举例看看. 函数:  pack(format,args+) pack()和unpack()函数的第一个参数表如下 Bash ...

  10. 基于Python37配置图片文字识别

    以管理员权限打开cmd控制台. 1.如何安装PIL 输入下面命令:pip install Pillow 参考:https://www.cnblogs.com/mrgavin/p/8177841.htm ...