vue 笔记1

created 钩子可以用来在一个实例被创建之后执行代码:

new Vue({
data: {
a: 1
},
created: function () {
// `this` 指向 vm 实例
console.log('a is: ' + this.a)
}
})
// => "a is: 1"

Object.freeze(obj)  ,这会阻止修改现有的属性,也意味着响应系统无法再追踪变化。

<span v-once>这个将不会改变: {{ msg }}</span>

双大括号会将数据解释为普通文本,而非 HTML 代码。为了输出真正的 HTML,你需要使用 v-html 指令
{{ number + 1 }}

{{ ok ? 'YES' : 'NO' }}

{{ message.split('').reverse().join('') }}

<div v-bind:id="'list-' + id"></div>

 每个绑定都只能包含单个表达式
{{ number + 1 }}

{{ ok ? 'YES' : 'NO' }}

{{ message.split('').reverse().join('') }}

<div v-bind:id="'list-' + id"></div>


computed为默认只有getter,我们可以提供一个setter:

var vm = new Vue({
el:'#box',
data:{
msg:'12345'
},
computed:{
reMsg:{
get:function(){
return this.msg.split('').reverse().join('')
},
set:function(value){
this.msg = value; //最后修改了msg
}
}
}
});
vm.reMsg="12345678"

console.log(vm.reMsg);

 

 

@click.prevent.self
@click.self.prevent

 

<!-- 同上 -->
<input v-on:keyup.enter="submit">

<!-- 缩写语法 -->
<input @keyup.enter="submit">


.enter全部的按键别名:

  • .tab
  • .delete (捕获“删除”和“退格”键)
  • .esc
  • .space
  • .up
  • .down
  • .left
  • .right
 

可以通过全局 config.keyCodes 对象自定义按键修饰符别名

 

// 可以使用 `v-on:keyup.f1`
Vue.config.keyCodes.f1 = 112




https://segmentfault.com/a/1190000010095089

  • Vue.component 注册全局组件,为了方便

  • Vue.extend 创建组件的构造函数,为了复用

  • mixins、extends 为了扩展

如果按照优先级去理解,当你需要继承一

 

 

posted @   ThisCall  阅读(138)  评论(0编辑  收藏  举报
编辑推荐:
· .NET 依赖注入中的 Captive Dependency
· .NET Core 对象分配(Alloc)底层原理浅谈
· 聊一聊 C#异步 任务延续的三种底层玩法
· 敏捷开发:如何高效开每日站会
· 为什么 .NET8线程池 容易引发线程饥饿
阅读排行:
· 终于决定:把自己家的能源管理系统开源了!
· 外部H5唤起常用小程序链接规则整理
· C#实现 Winform 程序在系统托盘显示图标 & 开机自启动
· 了解 ASP.NET Core 中的中间件
· 详解:订单履约系统规划
点击右上角即可分享
微信分享提示