在Vue2.x开发中，值传递方式的选择对代码组织和维护至关重要。面试中，面试官常常会关注这一话题。常见的传递方式包括：

Prop/$emit

Prop是Vue中最常用的值传递方式，约占80%。官方文档详细说明，不懂的可以查阅官方Prop文档。

$emit用于子组件向父组件传递事件，以实现单向数据流。修改Prop值需谨慎，因为Vue会警告。

$refs/$parent/$children/$root

这些方式不推荐，因为它们可能导致代码维护困难，特别是对$refs的使用，IDE追踪困难。

$refs用于访问子组件的元素，$parent/$children/$root则用于访问上下级组件的数据。

$attrs/$listener

在高阶组件中，$attrs用于处理非Prop的属性，$listener处理事件监听器。

provide/inject

封装高阶组件时，提供和注入能跨层级传递值，解决深度传递问题，但需注明值的来源。

eventBus/Vuex

eventBus相对复杂，Vuex适合复杂场景但不适合封装高阶组件，Vuex则适合全局状态管理。

Vue Router

路由传参常用，`/:id`和`?id=xxx`各有优劣，推荐使用后者便于灵活访问。

浏览器存储

本地存储可传递小量数据，如token，注意数据安全和有效期设置。

综上，选择值传递方式时，要考虑代码的可维护性和清晰度，特别是组件间传递，确保信息来源明确。每个项目可能需要结合多种方式，根据具体需求灵活运用。

本文地址： http://www.goggeous.com/i/1/608535

文章来源：天狐定制

版权声明：除非特别标注，否则均为本站原创文章，转载时请以链接形式注明文章出处。