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实现点击当前行变色
Dec 14 Vue.js
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
基于vuex实现购物车功能
Jan 10 Vue.js
vue实现防抖的实例代码
Jan 11 Vue.js
vue使用transition组件动画效果的实例代码
Jan 28 Vue.js
Vue+Bootstrap实现简易学生管理系统
Feb 09 Vue.js
使用Vue.js和MJML创建响应式电子邮件
Mar 23 Vue.js
vue.js Router中嵌套路由的实用示例
Jun 27 Vue.js
vue项目支付功能代码详解
Feb 18 Vue.js
vue中的可拖拽宽度div的实现示例
Apr 08 Vue.js
vue自定义右键菜单之全局实现
Apr 09 Vue.js
vue使用watch监听属性变化
Apr 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获取和操作配置文件php.ini的几个函数介绍
2013/06/24 PHP
Yii操作数据库的3种方法
2014/03/11 PHP
浅析PHP中的i++与++i的区别及效率
2016/06/15 PHP
自写的利用PDO对mysql数据库增删改查操作类
2018/02/19 PHP
jquery 滚动条事件简单实例
2013/07/12 Javascript
点击按钮或链接不跳转只刷新页面的脚本整理
2013/10/22 Javascript
jQuery绑定事件不执行但alert后可以正常执行
2014/06/03 Javascript
bootstrap3 兼容IE8浏览器!
2016/05/02 Javascript
使用jQuery Rotare实现微信大转盘抽奖功能
2016/06/20 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
2016/11/07 Javascript
Vue.js仿Metronic高级表格(一)静态设计
2017/04/17 Javascript
vue.js源代码core scedule.js学习笔记
2017/07/03 Javascript
基于JavaScript实现每日签到打卡轨迹功能
2018/11/29 Javascript
JS实现的简单tab切换功能完整示例
2019/06/20 Javascript
微信小程序简单的canvas裁剪图片功能详解
2019/07/12 Javascript
Vue使用虚拟dom进行渲染view的方法
2019/12/26 Javascript
微信小程序实现底部弹出框
2020/11/18 Javascript
Python简单删除目录下文件以及文件夹的方法
2015/05/27 Python
python网络爬虫之如何伪装逃过反爬虫程序的方法
2017/11/23 Python
Python通过Pygame绘制移动的矩形实例代码
2018/01/03 Python
Python数据分析之双色球统计两个红和蓝球哪组合比例高的方法
2018/02/03 Python
Python返回数组/List长度的实例
2018/06/23 Python
Django框架中序列化和反序列化的例子
2019/08/06 Python
Python如何使用函数做字典的值
2019/11/30 Python
Python 调用 ES、Solr、Phoenix的示例代码
2020/11/23 Python
Python字符串的15个基本操作(小结)
2021/02/03 Python
AmazeUI 缩略图的实现示例
2020/08/18 HTML / CSS
台湾流行服饰购物平台:OB严选
2018/01/21 全球购物
架构师岗位职责
2013/11/18 职场文书
机械设计专业应届生求职信
2013/11/21 职场文书
竟聘演讲稿范文
2013/12/31 职场文书
客服专员岗位职责
2015/02/10 职场文书
家属联谊会致辞
2015/07/31 职场文书
六年级作文之预言作文
2019/10/25 职场文书
Java中的随机数Random
2022/03/17 Java/Android
《模拟人生4》推出新补丁 “婚礼奇缘”DLC终于得到修复
2022/04/03 其他游戏