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 组件注册
Nov 20 Vue.js
vue打开其他项目页面并传入数据详解
Nov 25 Vue.js
vue中如何添加百度统计代码
Dec 19 Vue.js
vue中使用echarts的示例
Jan 03 Vue.js
vue+vant 上传图片需要注意的地方
Jan 03 Vue.js
聊聊vue 中的v-on参数问题
Jan 29 Vue.js
Vue常用API、高级API的相关总结
Feb 02 Vue.js
vue实现同时设置多个倒计时
May 20 Vue.js
在vue中import()语法不能传入变量的问题及解决
Apr 01 Vue.js
vue组件冲突之引用另一个组件出现组件不显示的问题
Apr 13 Vue.js
vue实现登陆页面开发实践
May 30 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实现数字补零功能的2个函数介绍
2014/05/12 PHP
php实现遍历目录并删除指定文件中指定内容
2015/01/21 PHP
再谈querySelector和querySelectorAll的区别与联系
2012/04/20 Javascript
jQuery源码分析之jQuery.fn.each与jQuery.each用法
2015/01/23 Javascript
一种基于浏览器的自动小票机打印实现方案(js版)
2016/07/26 Javascript
jQuery实现可移动选项的左右下拉列表示例
2016/12/26 Javascript
js中document.write和document.writeln的区别
2018/03/11 Javascript
解决vue项目报错webpackJsonp is not defined问题
2018/03/14 Javascript
详解webpack之图片引入-增强的file-loader:url-loader
2018/10/08 Javascript
JS实现的贪吃蛇游戏完整实例
2019/01/18 Javascript
JS实现根据详细地址获取经纬度功能示例
2019/04/16 Javascript
vue实现绑定事件的方法实例代码详解
2019/06/20 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
2019/10/23 Javascript
微信小程序自定义纯净模态框(弹出框)的实例代码
2020/03/09 Javascript
如何基于layui的laytpl实现数据绑定的示例代码
2020/04/10 Javascript
ES6新增的数组知识实例小结
2020/05/23 Javascript
vue axios封装httpjs,接口公用配置拦截操作
2020/08/11 Javascript
[01:59][TI9趣味视频] 全明星赛奖励
2019/08/23 DOTA
python监控网站运行异常并发送邮件的方法
2015/03/13 Python
python获取当前运行函数名称的方法实例代码
2017/04/06 Python
Python语言实现将图片转化为html页面
2017/12/06 Python
详解python中asyncio模块
2018/03/03 Python
python运行时强制刷新缓冲区的方法
2019/01/14 Python
Python迭代器iterator生成器generator使用解析
2019/10/24 Python
如何获取Python简单for循环索引
2019/11/21 Python
使用python从三个角度解决josephus问题的方法
2020/03/27 Python
在tensorflow以及keras安装目录查询操作(windows下)
2020/06/19 Python
丹麦优惠购物网站:PLUSSHOP
2019/03/24 全球购物
什么是托管函数?托管函数有什么用?
2014/06/15 面试题
献爱心倡议书
2014/04/14 职场文书
8和9的加减法教学反思
2014/05/01 职场文书
销售团队获奖感言
2014/08/14 职场文书
优秀党员个人总结
2015/02/14 职场文书
上课迟到检讨书范文
2015/05/06 职场文书
党组织结对共建协议书
2016/03/23 职场文书
解决Laravel使用验证时跳转到首页的问题
2021/11/17 PHP