@組件通信 / 博客 RSS 訂閱

Oct 25 2023

TANKING - Vue3項目創建+組合式API使用+組件通信+渲染微博熱搜+打包上線

摘要 Vue3的組合式API大大減少了代碼量，以及使用也方便了很多，本案例使用Vite創建一個Vue3示例，簡單介紹Vue3的組合式API使用以及父傳子組件傳參示例。 創建Vue3項目 1、首先要安裝 Node.js 下載地址：https://nodejs.org/en/download 2、安裝完成後，創建一個文件夾，用於創建 Vue 項目，我是在桌面創建的 3、在你創建的文件夾內的

vue.js , 組件通信 , vite , vue3 , Javascript

收藏 評論

Jul 03 2023

Java陳序員 - Vue3 組件通信方式

0. 前言 不管是 Vue2 還是 Vue3,組件通信方式很重要，不管是項目還是面試都是經常用到的知識點。 回顧一下 Vue2 中組件的通信方式： props:可以實現父子組件、子父組件、甚至兄弟組件通信 自定義事件:可以實現子父組件通信 全局事件總線 $bus:可以實現任意組件通信 pubsub:發佈訂閲模式實現任意組件通信 vuex:集中式狀態管理容器，實現任意組件通信 ref:

vue.js , 組件通信 , 前端

收藏 評論

Mar 26 2023

一顆冰淇淋 - 去中心化組件共享方案 —— Webpack Module Federation（模塊聯邦）

在大型應用中， 我們可能會對其進行拆分，分成容器、主應用和多個子應用，使拆分後的應用獨立開發與部署，更加容易維護。但無論是微應用、公共模塊應用，都需要放到容器中才能使用。 如果多個應用之間希望資源共享，除了使用 npm 包的形式，基於Webpack 5 Module Federation（模塊聯邦）實現的EMP微前端方案也可以一試，它不限制技術棧，但依賴於 Webpack5。 使用場景 如果應用B

組件通信 , 工程化 , webpack , 前端 , Javascript

收藏 評論

Apr 22 2022

十安 - 我説這是全網最全vue組件通信方式，你沒意見吧？

父子組件通信 prop event style和class natvie修飾符 $listeners v-model sync修飾符 $parent和$children $slots和$scopedSlots ref 跨組件通信 Provide和Inject router vuex store模式 eventbus 父子組件通信 prop 最常見的組件通信方式，由父組件向子組件傳遞。p

vue.js , 組件通信 , 前端 , Javascript

收藏 評論

Dec 15 2021

破曉L - React 50 種狀態類型

React 是一個視圖層框架，其核心思想是 UI = f(state)，即「UI 是 state 的投影」，state 自上而下流動，整個 React 組件樹由 state 驅動。當一個 React 應用程序足夠複雜，組件嵌套足夠深時，組件樹中的狀態流動會變得難以控制（例如你如何跟蹤父節點的 state 流動到葉子節點時產生的變化）。這時我們就需要對 state 進行管理，在進行狀態管理的同時，還

react , 狀態管理 , 組件通信 , 前端 , Javascript

收藏 評論

Oct 21 2021

沐華 - Vue3的7種和Vue2的12種組件通信，值得收藏

本文原文首發掘金：https://juejin.cn/post/699968... 如有不對的或者遺漏的，歡迎指正，你的一讚一評都是我前行最大的動力，感謝 Vue2.x組件通信12種方式寫在後面了，先來 Vue3 的 奧力給！ Vue3 組件通信方式 props $emit expose / ref $attrs v-model provide / inject Vuex Vue

vue.js , 組件通信 , vue3 , 前端

收藏 評論

Feb 24 2023

DiracKeeko - [React] [Vue] 從vue切換到react 組件的封裝和使用

在組件封裝上，兩個框架差的不遠。 在Vue中封裝組件，用插槽的方式子組件中寫好具名插槽的位置和樣式，在父組件中通過插槽名傳入html和js邏輯 部分。 在react中封裝組件，區別於Vue的地方在於，Vue中有插槽這個語法，而react中沒有。在react中的html和js邏輯部分的傳遞都需要藉由屬性組件的屬性(Props)來完成。 (在Vue中插槽傳值，在react中屬性傳值) 此外，Vue中組

react , vue.js , 組件通信 , 組件封裝 , 前端

收藏 評論

Nov 23 2021

墨城 - Vue3 和 Vue2 的 多種組件通信方式梳理

Vue3 通信使用寫法 1. props 方法一，混合寫法 // Parent.vue 傳送 child :msg1="msg1" :msg2="msg2"/child script import child from "./child.vue" import { ref, reactive } from "vue" export default { data(){ re

vue2 , 組件通信 , vue3

收藏 評論

Sep 15 2021

九是我呀 - React學習筆記——組件間通信

適用於剛開始接觸react直接上手的同學，建議還是打好JS和ES6基礎。 基礎 父傳子 子傳父 兄弟組件傳遞 進階（待完成） 不太相關組件之間傳遞 redux ref context observer pattern 全局變量 基礎內容 （1）父傳子：可以通過props將父組件數據傳給子組件 function Parent(){ return

組件通信

收藏 評論

Nov 05 2025

漫姐賊6 - 微信小程序自定義組件

一、小程序自定義組件 一個自定義組件由 json wxml wxss js 4個文件組成 1.自定義組件聲明 { "component": true //在json文件中進行自定義組件聲明 } 2.註冊組件 在自定義組件的 js 文件中，需要使用 Component() 來註冊組件，並提供組件的屬性定義、內部數據和自定義方法 Component({ properties: {

微信小程序 , 組件通信 , 小程序 , 組件化

收藏 評論