Как использовать теги vue -multiselect внутри решения asp. net с использованием VS 2017? - PullRequest
Новая
       43

Как использовать теги vue -multiselect внутри решения asp. net с использованием VS 2017?

0 голосов
/ 08 мая 2020

Я пытаюсь использовать теги vue -multiselect, но получаю некоторые ошибки, например:

"vue. js: 634 [Vue warn]: Неизвестный пользовательский элемент: - правильно ли вы зарегистрировали компонент? Для рекурсивных компонентов обязательно укажите параметр «имя». "

И:

" SyntaxError: запрошенный модуль 'https://unpkg.com/vue-multiselect@2.1.0 'не предоставляет экспорт с именем' default '"

Может ли кто-нибудь мне помочь?

мой сценарий: 

    <script type="module">
    import Multiselect from 'https://unpkg.com/vue-multiselect@2.1.0'

    export default {
        components: {
            Multiselect
        },
        data() {
            return {
                value: [
                    { name: 'Javascript', code: 'js' }
                ],
                options: [
                    { name: 'Vue.js', code: 'vu' },
                    { name: 'Javascript', code: 'js' },
                    { name: 'Open Source', code: 'os' }
                ]
            }
        },
        methods: {
            addTag(newTag) {
                const tag = {
                    name: newTag,
                    code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000))
                }
                this.options.push(tag)
                this.value.push(tag)
            }
        }
    }
</script>

мой html код: 

                <div>
                    <label class="typo__label">Tagging</label>
                    <multiselect v-model="value" tag-placeholder="Add this as new tag" placeholder="Search or add a tag" label="name" track-by="code" :options="options" :multiple="true" :taggable="true"></multiselect>
                    <pre class="language-json"><code>{{ value  }}

Ответы [ 3 ]

0 голосов
/ 08 мая 2020

Чтобы отобразить список «Экспортеров», вы должны установить параметры выбора как динамические c. Согласно документам Vue. js, вам нужно сделать что-то вроде: 

<select v-model="selected_exporter">
  <option v-for="exporter in exporters" v-bind:value="exporter.value">
    {{ exporter.description }}
  </option>
</select>
<span>Selected: {{ selected_exporter }}</span>

Затем вы хотите ввести ввод, если экспортер еще не существует, вы можете использовать v-if для показать или скрыть ввод.

0 голосов
/ 12 мая 2020

Сначала включите файлы: 

<script src="https://unpkg.com/vue-multiselect@2.0.6"></script>
<link rel="stylesheet" href="https://unpkg.com/vue-multiselect@2.0.6/dist/vue-multiselect.min.css">

Затем зарегистрируйте компонент: 

components: {
    Multiselect: window.VueMultiselect.default
},

Я нашел решение здесь:

https://github.com/shentao/vue-multiselect/issues/643

0 голосов
/ 08 мая 2020

Я думаю, что использование настраиваемого элемента управления вроде vue -multiselect с поддержкой тегов - это то, что вы ищете. См. здесь .

...