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实现动态加载表单
Dec 13 Vue.js
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
Dec 15 Vue.js
vue 使用 sortable 实现 el-table 拖拽排序功能
Dec 26 Vue.js
vue+element UI实现树形表格
Dec 29 Vue.js
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
Jan 08 Vue.js
详解vue之自行实现派发与广播(dispatch与broadcast)
Jan 19 Vue.js
学习 Vue.js 遇到的那些坑
Feb 02 Vue.js
vue 动态添加的路由页面刷新时失效的原因及解决方案
Feb 26 Vue.js
Vue Element-ui表单校验规则实现
Jul 09 Vue.js
Vue3如何理解ref toRef和toRefs的区别
Feb 18 Vue.js
vue ref如何获取子组件属性值
Mar 31 Vue.js
vue代码分块和懒加载非必要资源文件
Apr 11 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实现删除非站内外部链接实例代码
2014/06/17 PHP
php筛选不存在的图片资源
2015/04/28 PHP
php常用字符串String函数实例总结【转换,替换,计算,截取,加密】
2016/12/07 PHP
laravel框架之数据库查出来的对象实现转化为数组
2019/10/23 PHP
javascript getElementsByName()的用法说明
2009/07/31 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
window.open()详解及浏览器兼容性问题示例探讨
2014/05/29 Javascript
Javascript正则控制文本框只能输入整数或浮点数
2014/09/02 Javascript
javascript制作sql转换为stringBuffer的小工具
2015/04/03 Javascript
jQuery定义插件的方法
2015/12/18 Javascript
JavaScript与ActionScript3两者的同性与差异性
2016/09/22 Javascript
jQuery实现图片滑动效果
2017/03/08 Javascript
js+html5实现侧滑页面效果
2017/07/15 Javascript
vue+node+webpack环境搭建教程
2017/11/05 Javascript
微信小程序tabBar设置实例解析
2019/11/14 Javascript
微信小程序利用云函数获取手机号码
2019/12/17 Javascript
[02:31]DOTA2帕克 英雄基础教程
2013/11/26 DOTA
[10:18]2018DOTA2国际邀请赛寻真——Fnatic能否笑到最后?
2018/08/14 DOTA
[56:42]完美世界DOTA2联赛循环赛 Matador vs Forest 第二场 11.06
2020/11/06 DOTA
[01:06:59]完美世界DOTA2联赛PWL S2 Magma vs FTD 第一场 11.29
2020/12/02 DOTA
python抓取网页中的图片示例
2014/02/28 Python
python基于pygame实现响应游戏中事件的方法(附源码)
2015/11/11 Python
python 接口返回的json字符串实例
2018/03/27 Python
python 实现调用子文件下的模块方法
2018/12/07 Python
浅析python的Lambda表达式
2019/02/27 Python
Python数据类型之Set集合实例详解
2019/05/07 Python
Python模块汇总(常用第三方库)
2019/10/07 Python
python装饰器练习题及答案
2019/11/01 Python
关于Python 常用获取元素 Driver 总结
2019/11/24 Python
使paramiko库执行命令时在给定的时间强制退出功能的实现
2021/03/03 Python
HTML5实时语音通话聊天MP3压缩传输3KB每秒
2019/08/28 HTML / CSS
美国女士泳装店:Swimsuits For All
2017/03/02 全球购物
New Balance美国官网:运动鞋和健身服装
2017/04/11 全球购物
跟单文员的岗位职责
2013/11/14 职场文书
信用卡催款律师函
2015/05/27 职场文书
MySQL中你可能忽略的COLLATION实例详解
2021/05/12 MySQL