2019-08-21 vue在项目中的基本使用

vue目前在我部门项目中的用处就是* 双向绑定 *
js处理后数据变化html显示也要跟着变化,比如ajax请求后对数据进行修改,那么页面显示就会自动改变,同样的,html那边变化了js中的数据变量也要变化,比如用户输入数据后,在js中绑定的那些数据也会更新,常用与提交操作。

比如html有个列表

<select class="input-box" id="PersonService" name="personService" style="width: 207px"
        onchange="setEnabled(this)">
        <option value="0">请选择服务用途(必选)</option>
        <option v-if="serviceList" v-for="(item, index) in serviceList"
                :value="item.code" v-text="item.name">
        </option>
        <option value="29">其他</option>
</select>

js那就用vue通过列表的id将他绑定起来

var personalServiceVue = new Vue({
    el: '#PersonService',
    data: {
        serviceList: null
    },
    mounted: function () {
        $.ajax({
            success: function(data) {
                  personalServiceVue.serviceList = data;
             }
        });
    }
})

ajax请求完成后就将数据赋值给vue绑定的变量

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一:什么是闭包?闭包的用处? (1)闭包就是能够读取其他函数内部变量的函数。在本质上,闭包就 是将函数内部和函数外...
    xuguibin阅读 9,715评论 1 52
  • 1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-lin...
    jane819阅读 1,764评论 0 15
  • Vue 实例 属性和方法 每个 Vue 实例都会代理其 data 对象里所有的属性:var data = { a:...
    云之外阅读 2,235评论 0 6
  • vue概述 在官方文档中,有一句话对Vue的定位说的很明确:Vue.js 的核心是一个允许采用简洁的模板语法来声明...
    li4065阅读 7,266评论 0 25
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 2,961评论 1 4