props,data函数,computed执行顺序

props>data函数>computed>watch>生命周期函数>methods书写顺序

  • props

    • 最早被初始化,Vue 会先解析父组件传递的 props 数据,作为组件的初始数据来源。
    • 只有 props 初始化完成后,data 才能基于 props 来定义响应式数据。
  • data

    • props 之后执行,data 函数返回的对象会被 Vue 转化为响应式数据。
    • 可以在 data 中直接使用 props 的值来初始化本地数据。
  • computed

    • data 之后初始化,computed 的依赖会被 Vue 收集,当依赖变化时会自动重新计算。
    • computed 可以依赖 propsdata 的值,并且具有缓存特性。
  • methods

    • computed 之后绑定到组件实例上,它不会自动执行,只有在被调用时(比如模板中触发、生命周期钩子中调用)才会执行。
相关推荐
Asmewill3 小时前
MCP学习笔记
前端
小小19923 小时前
vue 单页面请求
开发语言·前端·javascript
hhb_6183 小时前
JavaScript 本地存储与动态数据渲染实战案例
开发语言·javascript·ecmascript
不会敲代码13 小时前
从 URL 到页面展示,还有哪些你忽略的底层细节?(DNS 与传输篇)
前端·面试
无心使然3 小时前
Openlayers调用ArcGis要素服务之一 ——要素查询 (/query)
前端·javascript·数据可视化
ZC跨境爬虫3 小时前
跟着 MDN 学 HTML day_1:(全套原生Input+表单结构拆解)
前端·css·ui·html
焰火19993 小时前
[前端]单文件上传组件
前端·vue.js
kyriewen113 小时前
Next.js部署:从本地跑得欢,到线上飞得稳
开发语言·前端·javascript·科技·react.js·前端框架·ecmascript
慕容卡卡3 小时前
Claude 使用神器(web页面)--CloudCLI UI
java·开发语言·前端·人工智能·ui·spring cloud
JarvanMo3 小时前
搞懂这 5 个 AI 术语,你就超过了 90% 的人
前端·后端