Как сделать так, чтобы сторонняя библиотека Vue имела доступ к другим сторонним используемым плагинам Vue? - PullRequest
Новая
       12

Как сделать так, чтобы сторонняя библиотека Vue имела доступ к другим сторонним используемым плагинам Vue?

0 голосов
/ 12 октября 2018

Допустим, я использую в проекте vuex, vue-i18n и Syncfusion ej2-vue-grids.

Мое приложение будет иметь доступ к $ store и $ t, но если я сделаю сеткуи определить пользовательский шаблон для столбца, компонент, который отображается в этом поле, не имеет доступа к vuex или vue-i18n.

Мне удалось обойти это для vuex, установив Vue.prototype.$store = store;при первой настройке приложения Vue.У vue-i18n есть несколько дополнительных свойств, и установка всего на прототип выглядит как хак.

Я предполагаю, что Syncfusion должен вызывать Vue.extend при создании компонентов для столбца сетки, поэтому компонент теряетвесь контекст из приложения.Это ошибка на их стороне, или есть что-то, что я должен делать по-другому?

EDIT Вот plnkr с примером поведения, которое явидя.

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

При первом просмотре столбец «Груз» должен быть пустым (потому что он не может получить доступ к магазину), а под сеткой должна быть строка !!!!!!!!(потому что он может получить доступ к магазину).

Если вы раскомментируете строку 15 в index.js, обе строки будут !!!!!!ниже сетки и содержимое столбца «Груз» должно быть видно.

1 Ответ

0 голосов
/ 17 октября 2018 
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>`
          }
        }
      }

Образец плунжера с обновленным шаблоном колонки с использованием магазина: https://plnkr.co/edit/Sei9F1MEvNyLGseZEzM1?p=preview

...