vue 获取到数据但却渲染不到页面上的解决方法


Posted in Vue.js onNovember 19, 2020

能获取到数据 数据却渲染不到页面上

问题描述: 我数据全部拿到了,js 里面写 console.log( musics ) 数据打印出来都正确,但是页面里面就是不显示。

很多时候对数据进行处理了,但是页面上就是没变化,没效果,用 console.log 打印数据都没问题,特别是数组、对象容易出现这个问题;

1、 this.$set( xxx )
保存变量

2、this.$forceUpdate( xxx )
强制更新,迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件。

另外:另外变量名别冲突,如下这种憨p情况

<script>
export default {
  name: 'xxx',
  props: {
    musics: {
      type: Array,
      default () {
        return []
      }
    }
  },
  data () {
    return {
      musics:[]
    }
  }
</script>

解决办法:
将 js 代码 data 中 musics:[ ] 删除,

到此这篇关于vue 获取到数据但却渲染不到页面上的解决方法的文章就介绍到这了,更多相关vue 获取数据但渲染不上内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Vue.js 相关文章推荐
详解如何在vue+element-ui的项目中封装dialog组件
Dec 11 Vue.js
vue watch监控对象的简单方法示例
Jan 07 Vue.js
Vuex实现简单购物车
Jan 10 Vue.js
详解Vue的options
May 15 Vue.js
vue+elementui 实现新增和修改共用一个弹框的完整代码
Jun 08 Vue.js
Vue.js中v-for指令的用法介绍
Mar 13 Vue.js
vue ref如何获取子组件属性值
Mar 31 Vue.js
Vue+TypeScript中处理computed方式
Apr 02 Vue.js
vue整合百度地图显示指定地点信息
Apr 06 Vue.js
vue3使用vuedraggable实现拖拽功能
Apr 06 Vue.js
vue的项目如何打包上线
Apr 13 Vue.js
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
Aug 05 Vue.js
vue 插槽简介及使用示例
Nov 19 #Vue.js
详解Vue的mixin策略
Nov 19 #Vue.js
一篇超完整的Vue新手入门指导教程
Nov 18 #Vue.js
vue3.0实现点击切换验证码(组件)及校验
Nov 18 #Vue.js
在Vue中使用Echarts可视化库的完整步骤记录
Nov 18 #Vue.js
详解vue实现坐标拾取器功能示例
Nov 18 #Vue.js
Vue如何循环提取对象数组中的值
Nov 18 #Vue.js
You might like
php visitFile()遍历指定文件夹函数
2010/08/21 PHP
SWFUpload与CI不能正确上传识别文件MIME类型解决方法分享
2011/04/18 PHP
php并发加锁问题分析与设计代码实例讲解
2021/02/26 PHP
jqeury eval将字符串转换json的方法
2011/01/20 Javascript
jQuery学习笔记之jQuery动画效果
2013/09/09 Javascript
Javascript数组与字典用法分析
2014/12/13 Javascript
jQuery制作简洁的多级联动Select下拉框
2014/12/23 Javascript
javascript每日必学之运算符
2016/02/16 Javascript
BootStrap智能表单实战系列(七)验证的支持
2016/06/13 Javascript
js图片上传前预览功能(兼容所有浏览器)
2016/08/24 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
2016/11/07 Javascript
jQuery中 bind的用法简单介绍
2017/02/13 Javascript
JS实现点击循环切换显示内容的方法
2017/10/19 Javascript
Vue.js+cube-ui(Scroll组件)实现类似头条效果的横向滚动导航条
2019/06/24 Javascript
IE11下处理Promise及Vue的单项数据流问题
2019/07/24 Javascript
vue项目强制清除页面缓存的例子
2019/11/06 Javascript
[01:50]WODOTA制作 DOTA2中文宣传片《HERO》
2013/04/28 DOTA
python函数参数*args**kwargs用法实例
2013/12/04 Python
Python读写Excel文件方法介绍
2014/11/22 Python
Python中集合的内建函数和内建方法学习教程
2015/08/19 Python
下载python中Crypto库报错:ModuleNotFoundError: No module named ‘Crypto’的解决
2018/04/23 Python
python rsync服务器之间文件夹同步脚本
2019/08/29 Python
简单瞅瞅Python vars()内置函数的实现
2019/09/27 Python
基于python实现微信好友数据分析(简单)
2020/02/16 Python
PyTorch 中的傅里叶卷积实现示例
2020/12/11 Python
css 元素选择器的简单实例
2016/05/23 HTML / CSS
五分钟学会HTML5的WebSocket协议
2019/11/22 HTML / CSS
莫斯科制造商的廉价皮大衣:Fursk
2020/06/09 全球购物
2014年高三毕业生自我评价
2014/01/11 职场文书
文明学生事迹材料
2014/01/29 职场文书
征婚广告词
2014/03/17 职场文书
学校宣传标语
2014/06/18 职场文书
医院2014国庆节活动策划方案
2014/09/21 职场文书
2015年语言文字工作总结
2015/07/23 职场文书
计算机教师工作总结
2015/08/13 职场文书
Golang 获取文件md5校验的方法以及效率对比
2021/05/08 Golang