script 中定义函数有几种写法？为什么有的用 methods 有的用 const？

在 Vue 的组件中，有几种常见的方式来定义函数：

1. 使用 methods 对象：您可以在组件的 methods 对象中定义函数。这种方式可以在组件的模板中直接调用这些函数。例如：

<script>
export default {
  methods: {
    handleClick() {
      // 处理点击事件的逻辑
    },
  },
};
</script>

2. 使用普通的 JavaScript 函数定义：您可以在 <script> 标签中直接编写 JavaScript 函数，并在需要的地方调用它们。这种方式可以灵活地定义和使用函数。例如：

<script>
function handleClick() {
  // 处理点击事件的逻辑
}

export default {
  // ...
};
</script>

3. 使用 computed 计算属性：如果您希望定义一个根据其他数据动态计算得出的函数，可以使用 computed 计算属性。计算属性会根据依赖的数据自动进行更新，而不需要手动调用。例如：

<script>
export default {
  data() {
    return {
      count: 0,
    };
  },
  computed: {
    doubledCount() {
      return this.count * 2;
    },
  },
};
</script>

4. 使用 const 声明：如果您只需要在组件的作用域内定义一个函数，并且不需要在模板中直接调用它，可以使用 const 声明一个函数。这种方式主要适用于内部使用的辅助函数。例如：

<script>
const helperFunction = () => {
  // 辅助函数的逻辑
};

export default {
  // ...
};
</script>

在编写 Vue 组件时，根据您的需求和函数的使用场景，可以选择适合的函数定义方式。methods 和普通 JavaScript 函数是最常用的方式，可以在模板中直接使用。computed 计算属性适用于根据其他数据进行计算的情况。const 声明适用于组件内部的辅助函数或私有函数，不需要在模板中调用。