<script src='./js/vue.js'></script>
</head>
<body>
<div id="app">
<!-- 模板语法，插值表达式 -->
<!-- 绑定变量 -->
<div>{{ title }}</div>
<!-- 运算 -->
<div>{{ 1+1 }}</div>
<!-- 字符串拼接 -->
<div>{{title + '-- @@'}}</div>
<!-- 调用js原生内置方法 -->
<div>{{title.substr(0,2)}}</div>
<!-- 调用vue中的方法 -->
<div>{{fn()}}</div>
<!-- 三元运算 -->
<div>{{2>1?'正确':'错误'}}</div>
<!--
注：vue模板语法中不能使用的
+ 变量声明
+ 定义函数
+ for / while / if
-->
</div>
<script>
var vm = new Vue({
el: '#app',
data() {
return {
// 声明一个数据
title: '你好vue',
// 把方法定义在此处，不好
// data中的数据我们会进行劫持，但function没有必要劫持，劫持也没有意义，反而影响性能
// fn: () => 'vue中的方法'
}
},
**// vue中的方法，它要求统一写在methods配置选项中
// methods中定义的方法，不能使用箭头函数，但是它里面中的函数建议全用箭头函数**
methods: {
// fn: () => 'vue中的方法'
// fn: () => {
// console.log(this);
// return 'aaaa'
// }
// fn: function () {
fn() {
setTimeout(() => {
console.log(this);
}, 100);
return 'abc'
}
}
})
09-02
847
847
03-28
406
406
04-24
1946
1946
07-29
447
447
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
