函数是十分优雅的语言特性，它让我们可以采用可复用的方式存储一段逻辑，从而不用重复代码就可以多次使用这一逻辑。在Vue的模板里，函数被定义为方法来使用。只要将一个函数存储为methods对象的一个属性，就可以在模板中使用它：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>方法</title> </head> <body> <div id="app"> <p>当前状态：{{statusFromId(status)}}</p> <!-- 除了在插值中使用方法，还可以在属性绑定中使用它们 --> <ul> <li v-for="number in filterPositive(numbers)">{{number}}</li> </ul> </div> <script src="https://unpkg.com/vue"></script> <script> let vue = new Vue({ el: "#app", data: { status: 0, numbers: [-3, -2, -1, 0, 1, 2, 3] }, methods: { statusFromId(id) { const status = ({ 0: "吃饭", 1: "睡觉", 2: "打豆豆" })[id]; return status || "未知状态" + id; }, filterPositive(numbers) { return numbers.filter((number) => number >= 0); } } }) </script> </body> </html>