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 相关文章推荐
在多个页面使用同一个HTML片段的代码
Mar 04 Javascript
JS 控件事件小结
Oct 31 Javascript
JavaScript DOM节点添加示例
Jul 16 Javascript
jQuery实现的产品自动360度旋转展示特效源码分享
Aug 21 Javascript
JS实现的文字与图片定时切换效果代码
Oct 06 Javascript
jQuery实现的表格展开伸缩效果实例
Sep 07 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
Feb 17 Javascript
浅谈es6 javascript的map数据结构
Dec 14 Javascript
详解如何制作并发布一个vue的组件的npm包
Nov 10 Javascript
详解mpvue中小程序自定义导航组件开发指南
Feb 11 Javascript
JavaScript计算正方形面积
Nov 26 Javascript
Angular之jwt令牌身份验证的实现
Feb 14 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个人网站架设连环讲(一)
2006/10/09 PHP
解析在PHP中使用全局变量的几种方法
2013/06/24 PHP
php实现爬取和分析知乎用户数据
2016/01/26 PHP
windows 2008r2+php5.6.28环境搭建详细过程
2019/06/18 PHP
基于Laravel 多个中间件的执行顺序详解
2019/10/21 PHP
javascript数组操作总结和属性、方法介绍
2014/04/05 Javascript
快速实现JS图片懒加载(可视区域加载)示例代码
2017/01/04 Javascript
JS实现上传图片实时预览功能
2017/05/22 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
基于Vue实现支持按周切换的日历
2020/09/24 Javascript
原生JS与jQuery编写简单选项卡
2017/10/30 jQuery
通过实例讲解JS如何防抖动
2019/06/15 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
2020/04/28 Javascript
js实现翻牌小游戏
2020/07/31 Javascript
vue3.0实现点击切换验证码(组件)及校验
2020/11/18 Vue.js
新手该如何学python怎么学好python?
2008/10/07 Python
用Python删除本地目录下某一时间点之前创建的所有文件的实例
2017/12/14 Python
Python自定义函数定义,参数,调用代码解析
2017/12/27 Python
python版学生管理系统
2018/01/10 Python
深入flask之异步非堵塞实现代码示例
2018/07/31 Python
python二进制文件的转译详解
2019/07/03 Python
Keras load_model 导入错误的解决方式
2020/06/09 Python
ECCO英国官网:丹麦鞋履品牌
2019/09/03 全球购物
Myprotein亚太地区:欧洲第一在线运动营养品牌
2020/12/20 全球购物
广州御银科技股份有限公司试卷(C++)
2016/11/04 面试题
学前教育求职自荐信范文
2013/12/25 职场文书
美术教师自我鉴定
2014/02/12 职场文书
《小白兔和小灰兔》教学反思
2014/02/18 职场文书
2014三八妇女节活动总结范文四篇
2014/03/09 职场文书
教师演讲稿大全
2014/05/16 职场文书
王金山在党的群众路线教育实践活动总结大会上的讲话稿
2014/10/25 职场文书
摘录式读书笔记
2015/07/01 职场文书
环境卫生标语
2015/08/03 职场文书
2016年暑期教师培训心得体会
2016/01/09 职场文书
机械生产实习心得体会
2016/01/22 职场文书
vue实现书本翻页动画效果实例详解
2022/04/08 Vue.js