SoFunction
Updated on 2025-04-05

vue solution to obtain data but cannot render on the page

Data can be obtained but the data cannot be rendered on the page

Problem description:I got all the data, and the data written in js ( musics ) is printed correctly, but the page just doesn't show it.

Many times the data is processed, but the page has no changes and no effect. It is no problem to print data with it, especially arrays and objects are prone to this problem;

1、 this.$set( xxx )
Save variables

2、this.$forceUpdate( xxx )
Force updates to force Vue instances to re-render. Note that it only affects the instance itself and the subcomponents that insert the contents of the slot, not all subcomponents.

In addition: In addition, don't conflict with variable names, as follows:

<script>
export default {
  name: 'xxx',
  props: {
    musics: {
      type: Array,
      default () {
        return []
      }
    }
  },
  data () {
    return {
      musics:[]
    }
  }
</script>

Solution:
Delete musics:[ ] in js code data,

This is the article about the solution to the vue obtaining data but not rendering on the page. For more related vue obtaining data but not rendering content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!