Vue中methods，watch与computed之间的差异

Methods?

????????methods 选项定义了组件中可以调用的方法。这些方法可以在模板中通过事件绑定或者在其他方法中调用。methods 中的函数可以接受参数，并且可以执行任意的 JavaScript 代码。因此，methods 主要用于处理组件中的用户交互、事件响应和自定义的操作。

Watch?

????????watch 选项用于监听一个或多个特定的数据变化，并在数据发生变化时执行相应的操作。当被监听的数据发生改变时，watch 中定义的函数会被调用。watch 可以执行异步操作、复杂的数据处理或触发其他方法，用于响应数据的变化并进行相应的处理。

Computed

????????computed 选项用于计算派生的数据属性，这些属性根据其他已有的响应式数据属性进行计算，返回一个新的值。computed 的值会被缓存，只有在依赖的响应式数据发生变化时才会重新计算。因此，computed 主要用于对现有数据进行计算、转换和过滤，以及生成响应式的派生数据。

主被动调用?

????????(1)methods是一种主动调用的方式，它定义了一组方法，在组件中通过方法名来调用。当组件状态改变时，methods 中的方法并不会自动更新，需要通过主动调用来触发更新。

????????(2)watch 是一种被动调用的方式，它用于监听特定的数据变化，当监听的数据发生改变时，执行相应的回调函数

????????(3)computed是一种被动调用的方式，它定义了一组计算属性，当关联的依赖数据发生改变时，计算属性会自动重新计算并返回结果。computed 会缓存计算结果，只有在依赖数据发生改变时才会重新计算，以提高性能。

触发次数

????????因为 methods 和 watch 是基于事件的，它们的触发需要手动调用或者响应数据变化，可以被多次触发。而 computed 的值是基于其依赖的响应式数据计算得出的，当依赖的数据发生变化时，computed 才会重新计算，并返回新的值。由于 computed 的值会被缓存，只有在依赖的响应式数据发生变化时才会重新计算，所以 computed 在同一依赖的数据没有变化的情况下只会触发一次。所以methods和watch是没有缓存的，而computed拥有缓存

支持异步

????????computed 的特点是它的值是基于其依赖的响应式数据计算而来的，并且具有缓存机制。这意味着当依赖的数据没有发生变化时，computed 的值会直接从缓存中获取，而不会重新计算。如果 computed 支持异步操作，那么每次计算时都需要等待异步操作完成才能返回值，这会破坏计算属性的简洁性和可预测性。methods 和 watch 不具备缓存机制，它们更加灵活，可以执行任意的 JavaScript 代码，包括异步操作。methods 中的方法可以直接调用异步函数，而 watch 的处理函数也可以是异步的，可以执行一些异步操作来响应特定数据的变化。\

使用场景

使用 methods：处理表单提交、按钮点击、列表操作等需要执行复杂逻辑或异步操作的场景。

使用 computed：计算列表长度、筛选数据、格式化日期、拼接字符串等需要基于已有数据进行计算的场景。

使用 watch：监听表单输入、监听路由变化、监听状态变化等需要监听特定数据变化并执行相应操作的场景。