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

 更新时间:2020年11月19日 09:03:05   作者:老程2048  
这篇文章主要介绍了vue 获取到数据但却渲染不到页面上的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

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

问题描述: 我数据全部拿到了,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实现列表滚动的过渡动画

    vue实现列表滚动的过渡动画

    这篇文章主要为大家详细介绍了vue实现列表滚动的过渡动画,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-06-06
  • vue粘贴复制功能的实现过程记录

    vue粘贴复制功能的实现过程记录

    最近在项目中遇到点击按钮复制链接功能,所以这篇文章主要给大家介绍了关于vue粘贴复制功能的实现过程,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2022-03-03
  • vue前端编译报错的图文解决方法

    vue前端编译报错的图文解决方法

    Vue框架可以很方便的引入各种插件,但是也因此会经常遇到种编译报错,这篇文章主要给大家介绍了关于vue前端编译报错解决的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下
    2024-03-03
  • vite结合electron构建前端桌面应用程序

    vite结合electron构建前端桌面应用程序

    本文主要介绍了vite结合electron构建前端桌面应用程序,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-05-05
  • Vue之Watcher源码解析(2)

    Vue之Watcher源码解析(2)

    这篇文章主要为大家详细介绍了Vue源码之Watcher的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • vue-class-setup 编写 class 风格组合式API

    vue-class-setup 编写 class 风格组合式API

    这篇文章主要为大家介绍了vue-class-setup 编写 class 风格组合式API,支持Vue2和Vue3,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • vue.js使用Element-ui实现导航菜单

    vue.js使用Element-ui实现导航菜单

    这篇文章主要为大家详细介绍了vue.js使用Element-ui中实现导航菜单,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • vue之debounce属性被移除及处理详解

    vue之debounce属性被移除及处理详解

    今天小编就为大家分享一篇vue之debounce属性被移除及处理详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • Vue解读之响应式原理源码剖析

    Vue解读之响应式原理源码剖析

    Vue 最独特的特性之一,是其非侵入性的响应式系统,下面这篇文章主要给大家介绍了关于Vue响应式原理源码剖析的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2021-10-10
  • vue3常用响应式对象的api,你全用过了吗

    vue3常用响应式对象的api,你全用过了吗

    这篇文章主要给大家介绍了关于vue3常用响应式对象api的相关资料,文中通过实例代码介绍的非常详细,对大家学习或者使用vue3具有一定的参考学习价值,需要的朋友可以参考下
    2023-02-02

最新评论