如何使第三方Vue库可以访问正在使用的其他第三方Vue插件?

时间:2018-10-12 13:43:47

标签: javascript vue.js vuejs2 syncfusion

假设我在一个项目中使用vuex,vue-i18n和Syncfusion ej2-vue-grids。

我的应用程序将有权访问$ store和$ t,但是如果我创建网格并为列定义自定义模板,则在该字段中呈现的组件将无法访问vuex或vue-i18n。 / p>

我第一次设置Vue应用程序时通过设置Vue.extend可以解决vuex的问题。但是,vue-i18n具有其他一些属性,并且在原型上设置所有内容都感觉很容易。

我假设在为grid列创建组件时Syncfusion必须正在调用index.js,因此该组件将从应用程序中丢失所有上下文。这是他们的错误,还是我应该做些不同的事情?

EDIT 这是一个plnkr,其中包含我所看到的行为的示例。

https://plnkr.co/edit/XwVC6yNQaI2vQIUoWfSm?p=preview

首次查看时,“货运”列应为空(因为它无法访问商店),并且在网格下方应是一行!!!!!!!! (因为它可以进入商店)。

如果您取消注释{{1}}中的第15行,则均为!!!!!!行在网格下方,并且货运列的内容应该可见。

1 个答案:

答案 0 :(得分:0)

We need to pass the store and vue-i18n reference to the template declaration.AS in below code snippet.
<pre>
<code>
   tmpl() {
        return {
          template: {
            store,
             i18n,
            data() {
              return {
                data: {}
              }
            },
            computed: {
              test() {
                return this.$store.state.test;
              }`enter code here`
            },
            template: `<div>
   <div> Translated text child: {{ $t("message.hello") }}</div>
<span>{{ test }} {{ data.Freight }} {{ test }}</span> </div>`
          }
        }
      }
</code>
</pre>

使用商店:https://plnkr.co/edit/Sei9F1MEvNyLGseZEzM1?p=preview

的带有更新的列模板的柱塞样品