Vue.js 学习

Posted 2022-11-27 @一支烟的功夫

Vue.js 学习（二）

事件处理

• 事件冒泡

如下代码

<div @click = "show2()">
<button type="button" @click="show()">
</div>

在执行的时候，需要对代码进行阻止冒泡处理，在show($event)可以传入对应的事件，在该方法里面令event.calcelBubble=true即可

网络请求

使用vue-resource.js 插件
常用发送方式有get、post、jsonp
使用方法：

• get

Vue.$http.get(‘url’,数据).then(function1,function2);

function1：表示请求成功的回调函数，接收一个参数

function2:请求失败的回调函数，接收一个参数

• post

post的使用方法同上 Vue.$http.post(…).then(…)，唯一需要注意的是Vue发送post请求，默认不会以键值对形式发送数据，需要增加一个参数emulateJSON:true，才可以。

• jsonp

jsonp的使用方法Vue.$http.jsonp(…).then(…)默认回调函数是callback如需修改需增加参数jsonp:’回调函数名称’

防止闪烁

使用v-cloak属性，然后配置

<style>[v-cloak]display:none;</style>

还有一种方法是使用v-text和v-html标签

计算属性

computed:
b:function()
return 1



其中计算属性其实有get和set方法，默认为get方法，必须要有返回值，set方法接受一个参数，用于修改计算属性的值

Vue实例简单方法

    1. vm.$el       => 指的是元素  

    2. vm.$data     => 指的是对象里面的data

    3. vm.$mount    => 手动挂载元素，如vm.$mount('#app')

    4. vm.$options  => 用于访问在对象里面自定义的属性，方法。