美文网首页
vue+layui实现select动态加载后台数据

vue+layui实现select动态加载后台数据

作者: 云上天os | 来源:发表于2019-07-25 15:33 被阅读0次

<div id="demo" class="layui-inline layui-form" lay-filter="test2">

  <select>

  <option v-for="option in options" v-bind:value="option.id">

    {{ option.name }}

  </option> </select>

</div>

var vue = new Vue({

  el: '#demo',

  data: {

option: {},

    options: []

  },

          created: function () {

                this.send();

          },

          updated: function () {

                layui.form.render('select','test2');

                console.log(layui.form);

          },

  methods:{

  send() {

  axios({

                  method:'get',

                  url:'${contextPath}/find?page=1&limit=100'

              }).then(resp => {

              this.options = resp.data.data;

                  console.log(resp.data.data);               

              }).catch(resp => {

                  console.log('请求失败:'+resp.status+','+resp.statusText);

              });

          } 

  },

})

相关文章

网友评论

      本文标题:vue+layui实现select动态加载后台数据

      本文链接:https://www.haomeiwen.com/subject/lnphrctx.html