·用于存储需要在Vue实例中使用的函数。

    methods 选项 - 图1

    ·methods中的方法可以通过vm.方法名访问。

    ·方法中的 this为vm实例,可以便捷的访问vm数据等功能。

    methods 选项 - 图2

    <!DOCTYPE html> <html lang=“en”> <head> <meta charset=“UTF-8”> <meta name=“viewport” content=“width=device-width, initial-scale=1.0”> <title>Document</title> </head> <body> <div id=“app”> <p>{{ title1.split(‘-‘).join(‘’) }}</p> <p>{{ title2.split(‘-‘).join(‘’) }}</p> <p>{{ fn(title1) }}</p> <p>{{ fn(title2) }}</p> </div> <script src=“lib/vue.js”></script> <script> var vm = new Vue({ el: ‘#app’, data: { prefix: ‘处理的结果为:’, title1: ‘a-b-c-d-e’, title2: ‘x-y-z’ }, methods: { fn (value) { // console.log(this); this.fn1(); this.fn2(); return this.prefix + value.split(‘-‘).join(‘’); }, fn1 () { console.log(‘执行了 fn1 的代码’); }, fn2 () { console.log(‘执行了 fn2 的代码’); } } }); // console.log(vm) </script> </body> </html>