代码之家 › 专栏 › 技术社区 › minisaurus

Vue未更新

vuejs2 html javascript

minisaurus · 技术社区 · 6 年前

<div id="error" class="col s12 red center">
  <span v-if="seen">
    Error fetching readings: {{ msg }}
  </span>
</div>

Vue:

var error = new Vue({
  el: '#error',
  data: {
    msg: '',
    seen: false
  },
  methods: {
    show: function(message) {
      this.msg = message;
      this.seen = true;
    },
    hide: function() {
      this.seen = false;
    }      
  }
});

fetch( ... )
.then(...)
.catch(err => {
    error.show( err );
    loader.hide();
});

错误。显示()显示先前隐藏的div,但显示:

Error fetching readings: {}

为什么?

2 回复 | 直到 6 年前

Ben Croughs 6 年前

可以找到样本,检查代码地狱世界.vue在组件文件夹中 https://codesandbox.io/s/x2klzr59wo

<template>
  <div id="error" class="col s12 red center">
    {{ seen }}
    <hr />
    <span v-if="computedSeen"> Error fetching readings: {{ msg }} </span>
    <hr />
    <button @click="show('effe');">SHOW</button> &nbsp;
    <button @click="hide();">HIDE</button>
  </div>
</template>
<script>
export default {
  name: "HelloWorld",
  data() {
    return {
      msg: "",
      seen: false
    };
  },
  methods: {
    show: function(message) {
      this.msg = message;
      this.seen = true;
    },
    hide: function() {
      this.seen = false;
    }
  },
  computed: {
    computedSeen: function() {
      // `this` points to the vm instance
      return this.seen;
    }
  }
};
</script>

minisaurus 6 年前

哦,问题是 err 从 fetch 是一个对象,我应该用 err.message .

在我的代码里我有一个 console.log('Error: %s', err) 它似乎格式化了对象转换为文本。这正是让我震惊的原因:(

对不起的。

推荐文章

4r60_ · 如何停止VueJS上的间隔?[副本]

2 年前

Park · Vuejs道具,路径较长

3 年前

Mathijs · vue-chartjs4中的混合气泡图和折线图

3 年前

roev · 大堆来自(物体)。forEach不使用vue。js

3 年前

haferje · Vue。用于计算属性重新渲染的js加载指示器

7 年前

Ready Dev · Axios一次发出多个请求(vue.js)

7 年前

JeanValjean · 如何在Vue中使用事件总线通过自定义事件传递数据。js 2

7 年前

dede.brahma · VueJs-元素UI el select:如何获取值父级和子级

7 年前

tzortzik · 如何使用vue路由器将对象作为道具传递?

7 年前

Tim · VueJS-迭代从AJAX调用返回的数据

7 年前