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中使用CSS3实现内容无缝滚动的示例代码
Nov 27 Vue.js
详解Vue3 Teleport 的实践及原理
Dec 02 Vue.js
vue导入.md文件的步骤(markdown转HTML)
Dec 31 Vue.js
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
详解Vue的七种传值方式
Feb 08 Vue.js
vue-cli中实现响应式布局的方法
Mar 02 Vue.js
vue+springboot实现登录验证码
May 27 Vue.js
Vue过滤器(filter)实现及应用场景详解
Jun 15 Vue.js
简单聊聊Vue中的计算属性和属性侦听
Oct 05 Vue.js
一篇文章告诉你如何实现Vue前端分页和后端分页
Feb 18 Vue.js
Axios代理配置及封装响应拦截处理方式
Apr 07 Vue.js
Vue router配置与使用分析讲解
Dec 24 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
水质对咖图啡风味的影响具体有哪些
2021/03/03 冲泡冲煮
php面向对象全攻略 (一) 面向对象基础知识
2009/09/30 PHP
php图片加中文水印实现代码分享
2012/10/31 PHP
基于magic_quotes_gpc与magic_quotes_runtime的区别与使用介绍
2013/04/22 PHP
解决yii2左侧菜单子级无法高亮问题的方法
2016/05/08 PHP
PHP图片添加水印功能示例小结
2016/10/03 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
PHP内部实现打乱字符串顺序函数str_shuffle的方法
2019/02/14 PHP
PHP get_html_translation_table()函数用法讲解
2019/02/16 PHP
thinkphp5框架实现数据库读取的数据转换成json格式示例
2019/10/10 PHP
用js自动判断浏览器分辨率的代码
2007/01/28 Javascript
jQuery之尺寸调整组件的深入解析
2013/06/19 Javascript
jquery选择器-根据多个属性选择示例代码
2013/10/21 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
JavaScript实现格式化字符串函数String.format
2016/12/16 Javascript
Angular.JS中的指令引用template与指令当做属性详解
2017/03/30 Javascript
VueJS如何引入css或者less文件的一些坑
2017/04/25 Javascript
vue实现倒计时获取验证码效果
2020/04/17 Javascript
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
2019/11/21 Javascript
python爬虫教程之爬取百度贴吧并下载的示例
2014/03/07 Python
Python map和reduce函数用法示例
2015/02/26 Python
Python爬虫利用cookie实现模拟登陆实例详解
2017/01/12 Python
python RabbitMQ 使用详细介绍(小结)
2018/11/08 Python
python通过链接抓取网站详解
2019/11/20 Python
python实现canny边缘检测
2020/09/14 Python
使用CSS3制作倾斜导航条和毛玻璃效果
2017/09/12 HTML / CSS
详解使用postMessage解决iframe跨域通信问题
2019/11/01 HTML / CSS
Elemis美国官网:英国的第一豪华护肤品牌
2018/03/15 全球购物
个人委托书
2014/07/31 职场文书
政风行风评议心得体会
2014/10/21 职场文书
2014离婚协议书范文(3篇)
2014/11/29 职场文书
2015年幼师工作总结
2015/04/28 职场文书
初中家长意见
2015/06/03 职场文书
离职信范文
2015/06/23 职场文书
2019年大学生暑期社会实践调查报告模板
2019/11/07 职场文书
Python文件的操作示例的详细讲解
2021/04/08 Python