Vue中的v-for指令不起效果的解决方法


Posted in Javascript onSeptember 27, 2018

我的代码之前类似下面的结构

<div id="example-1" v-for="item in items">
 <ul>
  <li>
   {{ item.message }}
  </li>
 </ul>
</div>

结果发现不好用,数据读入了但是没有显示

于是我后来看官网的例子才明白,原来是id和v-for不在一个层级上,官网的例子如下,我按照不在一个层级上改,果然好用了

<ul id="example-1">
 <li v-for="item in items">
  {{ item.message }}
 </li>
</ul>

以上这篇Vue中的v-for指令不起效果的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在IE中调用javascript打开Excel的代码(downmoon原作)
Apr 02 Javascript
实现局部遮罩与关闭原理及代码
Feb 04 Javascript
Javascript闭包用法实例分析
Jan 23 Javascript
jQuery实现自动切换播放的经典滑动门效果
Sep 12 Javascript
JavaScript30 一个月纯 JS 挑战中文指南(英文全集)
Jul 23 Javascript
weex里Vuex state使用storage持久化详解
Sep 09 Javascript
Javascript网页抢红包外挂实现分享
Jan 11 Javascript
《javascript少儿编程》location术语总结
May 27 Javascript
ES6 中可以提升幸福度的小功能
Aug 06 Javascript
javascript 代码是如何被压缩的示例代码
May 06 Javascript
详解vue 组件
Jun 11 Javascript
在nuxt中使用路由重定向的实例
Nov 06 Javascript
在vue中使用v-bind:class的选项卡方法
Sep 27 #Javascript
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
Sep 27 #Javascript
详解如何在vue项目中使用lodop打印插件
Sep 27 #Javascript
浅谈在vue中使用mint-ui swipe遇到的问题
Sep 27 #Javascript
Vue引用Swiper4插件无法重写分页器样式的解决方法
Sep 27 #Javascript
swiper在angularjs中使用循环轮播失效的解决方法
Sep 27 #Javascript
解决Vue使用swiper动态加载数据,动态轮播数据显示白屏的问题
Sep 27 #Javascript
You might like
php合并数组array_merge函数运算符加号与的区别
2008/10/31 PHP
实用的PHP带公钥加密类分享(每次加密结果都不一样哦)
2014/08/20 PHP
PHP用mb_string函数库处理与windows相关中文字符及Win环境下开启PHP Mb_String方法
2015/11/11 PHP
详解PHP实现执行定时任务
2015/12/21 PHP
php抽象方法和抽象类实例分析
2016/12/07 PHP
javascript实现促销倒计时+fixed固定在底部
2013/09/18 Javascript
JS随机调用指定函数的方法
2015/07/01 Javascript
jQuery链式操作实例分析
2015/11/16 Javascript
Bootstrap模态框调用功能实现方法
2016/09/19 Javascript
BootStrap下拉菜单和滚动监听插件实现代码
2016/09/26 Javascript
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
vue自定义全局组件(自定义插件)的用法
2018/01/30 Javascript
微信小程序App生命周期详解
2018/01/31 Javascript
基于Vue实现可以拖拽的树形表格实例详解
2018/10/18 Javascript
jQuery实现动态加载(按需加载)javascript文件的方法分析
2019/05/31 jQuery
Vue+Typescript中在Vue上挂载axios使用时报错问题
2019/08/07 Javascript
layui在form表单页面通过Validform加入简单验证的方法
2019/09/06 Javascript
Javascript 关于基本类型和引用类型的个人理解
2019/11/01 Javascript
JS数组方法shift()、unshift()用法实例分析
2020/01/18 Javascript
[00:43]TI7不朽珍藏III——幽鬼不朽展示
2017/07/15 DOTA
[01:12]快闪回顾DOTA2亚洲邀请赛(DAC) 静候2018新征程开启
2018/03/11 DOTA
利用Python获取操作系统信息实例
2016/09/02 Python
python交互式图形编程实例(三)
2017/11/17 Python
Selenium鼠标与键盘事件常用操作方法示例
2018/08/13 Python
Python提取特定时间段内数据的方法实例
2019/04/01 Python
PowerBI和Python关于数据分析的对比
2019/07/11 Python
pandas使用函数批量处理数据(map、apply、applymap)
2020/11/27 Python
美国女士泳装店:Swimsuits For All
2017/03/02 全球购物
意大利简约的休闲品牌:Aspesi
2018/02/08 全球购物
SneakerStudio英国:最佳运动鞋商店
2019/05/22 全球购物
什么是事务?事务有哪些性质?
2012/03/11 面试题
八一建军节活动方案
2014/02/10 职场文书
MySQL的join buffer原理
2021/04/29 MySQL
Python 循环读取数据内存不足的解决方案
2021/05/25 Python
Python获取江苏疫情实时数据及爬虫分析
2021/08/02 Python
关于vue-router-link选择样式设置
2022/04/30 Vue.js