A、****父組件執行子組件方法**** ref='funSon' 1.子組件上，添加 ref='funSon' 2.切換到子組件可直接寫個 son() 方法 3.這里的 funSon 只是個名稱 4.this.$refs.funSon.son(); 直接調用子組件的方法 this.$refs.funSon 返回的是一個vue對象，所以可以直接調用其方法 B、****子組件執行父組件方法**** @chirdfuntion="editfun" 1. chirdfuntion 這是我們要切換到子組件調用的名稱 2. editfun 這是我們父組件 methods 里的一個方法 3. this.$emit('chirdfuntion'); 切換到子組件，看個方法 可以直接執行父組件的 editfun 方法 C、****子組件獲取父組件的值**** :inputName="name" :pyp="age" 1. inputName pyp //子組件引的鍵； 2. name age //父組件data里面值得內容 3. 切換到子組件文件,直接引入 export default{ props:['inputName','pyp'], } 4. this.$props this.$props.inputName this.$props.pyp 這樣子組件就拿到了父組件的值 D、****路由傳值，取值**** 1. vue router/index.js 文件配置 { path: '/home/:id/:cusid', name:'Home' component: Home }, 2. 跳轉到相對于的詳情，這里的id cusid 取值根據借口返回或者我們自定義的值 名稱要與路由index.js配置的相匹配 this.$router.push({path: `/home/${id}/${cusid}`}) 跳轉的設置 this.$route.params.id this.$route.params.cusid 獲取到我們的參數 ``` <template> <ass-two :inputName="name" :pyp="age" @chirdfuntion="editfun" ref='funSon' ></ass-two> </template> <script> /** ./ 是在當前文件所在的目錄; ../ 是當前文件所在目錄的父目錄; **/ import AssTwo from "./AssemblyTwo";//組件的引入 再注冊 export default { components: { //組件注冊 AssTwo }, data() { return { name: "", }; }, methods:{ editfun(){ //方法 //執行子組件方法 }, } }; </script> <style scoped> </style> ```