首页 文章

在Vue.js和Materializecss中使用多个'select' HTML元素

提问于
浏览
1

我正在尝试使用Vue.js创建一个HTML多选表单元素 . 它遵循this后完美运行 . 但是,如果我要添加Materialize css,则select元素看起来更好,但它不起作用,我收到这些警告:

[Vue warn] ::使用v-model时,将忽略内联选定的属性 . 而是在组件的数据选项中声明初始值 . [Vue warn]:期望一个Array值用于绑定,但得到Number(在根实例中找到)

这是我的Vue.js代码:

var app = new Vue({
          el: '#app',
          data: {
            selected: 900,
            options: [{
              value: 12,
              text: 12
            }, {
              value: 24,
              text: 24
            }, {
              value: 36,
              text: 36
            }]
          },

这是select元素:

<select v-model="selected" multiple>
    <option selected value="900">Please Select</option>
    <option v-for="option in options" :value="option.value">
    {{ option.text }}
    </option>
</select>
<label>Select appropraite data type(s)</label>

1 回答

  • 0

    结合常规 Vue 和常规 Materialize 不是一个好主意 . 由于有几个相互矛盾的因素无法轻易解决,但下面有两个有用的库 . 还有一些不推荐使用的库,但旧版本工作正常 .

    Vue-MaterializeCeri-Materialize将很好地满足您的目的 .

相关问题