Question

是否有使用vue.js的on-shown和on-show等回调方法？

我正在使用v-show =＆＃34; my-condition＆＃34;在div元素上。但内部是一些chart.js图表，除非可见，否则无法呈现。

任何人都知道如何在父母可见的情况下渲染chart.js？它们位于可选标签内，因此可能会多次触发。

我正在使用Vue.js和vue-strap。

Answer 1

结帐this answer - 在类似情况下使用nextTick()为我工作。简而言之：

new Vue({
 ...

  data: {
    myCondition: false
  },

  watch: {
    myCondition: function () {
      if (this.myCondition) {
        this.$nextTick(function() {
          // show chart
        });
      } else {
        // hide chart
      }
    }
  },

  ...
})

Answer 2

您描述的没有event。

但是，您可以使用computed这样的属性：

new Vue({
  ...

  data: {
    myCondition: false
  },

  computed: {
    showChart: function () {
      if (this.myCondition) {
        // show chart
      } else {
        // hide chart
      }

      return this.myCondition
    }
  },

  ...
})


<div v-show="showChart"></div>

https://jsfiddle.net/xhfo24qx/

Answer 3

custom-directive可以将此目标归档为此目标

例如： https://stackoverflow.com/a/49737720/4896468

docs： https://vuejs.org/v2/guide/custom-directive.html

在vue.js中回调v-show

3 个答案: