Javascript:加载页面时出错

安德斯·布茨曼·拉森

我正在调用 API,每次加载页面时都会出现此错误,我不知道为什么。谁能告诉我为什么?我试着把它:

浏览器说什么

这是我使用总金额的标记:

<div class="summary__graph">
        <div class="graph__header">
          <h3 class="headline">Fordeling</h3>
          <p class="answers">{{company.amount.total}} besvarelser</p>
        </div>

这是我定义我的公司的地方,我用总价值填充

 data () {
    return {
      selected: 1,
      datacollection: null,
      datacollection2: null,
      datacollection3: null,
      company: '',
      isActive: false,
      scoreLine: null,
      timeBar: null,
      answerPercent: null

    }
  },

vue.js 挂载和方法

  mounted () {
    this.getStoreScore()
    this.fillData()
    this.fillData2()
    this.fillData3()
    this.fillDataScoreLine()
    this.fillDataTimeBar()
    this.fillDataAnswerPercent()
  },


getStoreScore () {
      return axios.post('API', {
        storeId: '5b7515ed5d53fa0020557447'
      }).then(response => {
        this.company = {
          'storeScore': response.data.result,
          'amount': {
            'total': response.data.amount.total,
            'zero': {
              'amount': response.data.amount.zero,
              'percentage': response.data.amount.zero / response.data.amount.total * 100
            },
            'one': {
              'amount': response.data.amount.one,
              'percentage': response.data.amount.one / response.data.amount.total * 100
            },
            'two': {
              'amount': response.data.amount.two,
              'percentage': response.data.amount.two / response.data.amount.total * 100
            },
            'three': {
              'amount': response.data.amount.three,
              'percentage': response.data.amount.three / response.data.amount.total * 100
            }
          }
        }
        return this.company
      })
    },

谁能告诉我为什么它给我这个错误?:D

贝蒂恩·鲍威尔斯

因为您正在进行 API 调用,所以页面会在您收到任何数据之前呈现。您会收到错误,因为company.amount页面呈现时未定义。有一些可能的修复方法:要么延迟页面渲染,直到接收到所有数据,要么编写一个快速的 if 条件。

<p class="answers">{{company.amount.total}} besvarelser</p>

更多信息:https : //vuejs.org/v2/guide/conditional.html

编辑:您的代码将成为

<p v-if="company.amount" class="answers">{{company.amount.total}} besvarelser</p>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在页面加载时加载Javascript

来自分类Dev

页面加载时的JavaScript加载屏幕

来自分类Dev

如何在页面加载时加载 Javascript

来自分类Dev

动态加载javascript文件时出错

来自分类Dev

页面加载宏弹出YouTube视频时出错

来自分类Dev

在Coldfusion页面加载时执行javascript

来自分类Dev

页面加载时正在调用Javascript函数

来自分类Dev

Javascript onFocus在页面加载时触发

来自分类Dev

页面加载时自动启动JavaScript功能

来自分类Dev

在页面加载时触发多个JavaScript函数

来自分类Dev

Javascript onclick在页面加载时触发

来自分类Dev

JavaScript onclick事件在页面加载时触发

来自分类Dev

使用javascript放大页面加载时的div

来自分类Dev

页面加载时的Javascript SlideFadeToggle表单

来自分类Dev

Sharepoint Javascript 在页面加载时失败

来自分类Dev

Javascript - 在页面加载时自动点击按钮

来自分类Dev

javascript - 菜单在页面加载时打开

来自分类Dev

jQuery在初始页面加载时重新加载javascript资源

来自分类Dev

页面加载时仅加载一个JavaScript函数。

来自分类Dev

页面加载时仅加载一个JavaScript函数。

来自分类Dev

加载WebappClassLoader时出错

来自分类Dev

加载FacesContextFactory时出错

来自分类Dev

渴望加载时出错

来自分类Dev

加载图像时出错

来自分类Dev

加载SoX时出错

来自分类Dev

加载 webview 时出错

来自分类Dev

Javascript函数在页面加载时触发,而不是单击时触发

来自分类Dev

xWalkWebView加载页面时?

来自分类Dev

Rails JavaScript仅在您刷新页面时加载,而不在原始页面加载时加载,这是怎么回事?