2. 程式人生 > >《Vue.js實戰》筆記 第七章（重點）

《Vue.js實戰》筆記 第七章（重點）

阿新 • • 發佈：2018-12-16
Vue.component("first-component",{ template:'\ <button @click="handleIncrease">+1</button>\ <button @click="handleReduce">-1</button>\ ', data: function(){ return { counter: 0 } }
, methods: { handleIncrease:function(){ this.counter++; this.$emit("increase",this.counter); }, handleReduce:function(){ this.counter--; this.$emit("reduce",this.counter); } }
}); Vue.component("second-component",{ template:'\ <button @click="handleClick">+1</button>\ ', data: function(){ return { counter: 0 } }, methods: { handleClick:function()
{ this.counter++; this.$emit("input",this.counter); } } }); Vue.component("third-component",{ props:['value'], template:'<input :value="value" @input="updateValue">', methods: { updateValue:function(event) { this.$emit("input",event.target.value); } } }); var bus = new Vue(); Vue.component("forth-component",{ template:'<button @click="handleEvent">傳遞事件</button>', methods: { handleEvent:function(){ bus.$emit("on-message","來自元件forth的內容"); this.$parent.msg = "來自forth的內容,修改了父鏈" } } }); Vue.component("fifth-component",{ template:'<p>ref=comA的子元件</p>', data:function(){ return { message:"fifth子元件的內容" } } }) var first = new Vue({ el:"#first", data:{ total: 0, totals: 0, totales: 0, msg:"Parent", message:"", refmsg:"", }, mounted:function() { var _this = this ; bus.$on("on-message",function(msg){ _this.message = msg; }) }, methods:{ handleGetTotal:function(total){ this.total = total; }, handleRe:function(){ this.totales--; }, handleRef:function(){ var msg = this.$refs.comA.message; this.refmsg = msg; console.log(msg); } } })

相關推薦

《Vue.js實戰》筆記 第七章（重點）

Vue.component("first-component",{ template:'\ <button @click="handleIncrease">+1</button>\ <but

IP通信基礎課堂筆記------第三章（重點）

同時 由於 重要 相對 auth 分開 數學 ip協議 互連 一. IPv4地址格式 網絡互連的一個重要前提條件是要有一個有效的地址結構，並且所有的互連網絡用戶都應遵守這個地址結構。因為只有這樣所有的互連網絡用戶才能在統一的規定下相互之間通訊。這個地址結構可以有許多不同的

Vue.js-07：第七章 - Vue 例項的生命週期

 一、前言 　　 在之前的 Vue 學習中，我們在使用 Vue 時，都會建立一個 Vue 的例項，而每個 Vue 例項在被建立時都要經過一系列的初始化過程。例如，需要設定資料監聽、編譯模板、將例項掛載到 DOM 並在資料變化時更新 DOM 等。在這個過程中，Vue 會執行一些生命週期鉤子

CSAPP讀書筆記第七章:（變數作用域與連結器）

[1]程式經過預處理和編譯之後變成可重定位目標檔案。每一個可重定位目標檔案都有一個表,這個表含有當前檔案定義的變數(函式),引用的函式。 這些變數有幾種型別:(1)當前模組定義的全域性變數(非static)(2)當前模組定義全域性變數(非static)(3

vue.js實戰學習——內置指令（一）

name 初始 節點 刪除 html元素 data post 編譯 16px 註：此內容摘抄自：梁灝的《Vue.js實戰》 註：記得要引入vue.js才能運行哦，文章中貼出的代碼直接復制是不行的，html css js 都放在了一起，而且也沒有引用vue.js。 1.v

計算機組成原理筆記-第三章（哈工大）

1.匯流排的基本概念 匯流排：是連線各個部件的資訊傳輸線，是各個部件共享的傳輸介質。 匯流排的傳輸方式： 序列——長距離 ，一次傳輸1位            並行——短距離，一次傳輸n位 2.匯流排分類 1.片內匯流排   晶片內部的匯流排

《Python資料分析與挖掘實戰》第10章（上）——DNN

本文是基於《Python資料分析與挖掘實戰》的實戰部分的第10章的資料——《家用電器使用者行為分析與事件識別》做的分析。旨在補充原文中的細節程式碼，並給出文中涉及到的內容的完整程式碼；另外，原文中的資料處理部分排版先後順序個人感覺較為凌亂，在此給出梳理。在作者所給程式碼的基礎

Win32API學習筆記第六章（二）

這次記錄的是一部分選單的內容（由於VS生成的已經比較全面了，所以這裡主要是講使用） // Win32ProjectRc.cpp : 定義應用程式的入口點。 // #include "stdafx.h" #include "Win32ProjectRc.h

Vue.js實戰系列---餓了麼（1）基礎知識

MVVM框架：針對具有複雜互動邏輯的前端應用，提供基礎的架構抽象，通過Ajax資料持久化，保證前端使用者體驗。不需要重新整理整個頁面，只需要重新整理需要重新整理的部分，非常適合移動端。vue.js：是一個輕量級的MVVM的框架，資料驅動+ 元件化的前端開發與Angular R

鳥哥的Linux私房菜筆記第六章（二）

檔案內容查詢 直接查詢檔案內容 查閱一個檔案的內容可以使用指令cat/tac/nl。 # [cat|tac|nl] 檔案 區別： 1.cat是直接把檔案內容輸出到螢幕上，並且從第一行開始輸出到末行 2.tal和cat相同，只不過tal是從末行反過來開始輸出到第一行 3.nl則是可以新增行號列印，第一行可以顯示

《機器學習實戰》第七章學習筆記（AdaBoost）

一、整合學習整合學習（ensemble learning）通過構建並結合多個學習器來完成學習任務，有時也被稱為多分類器系統（multi-classifier system）、基於委員會的學習（committee-based learning）等。整合學習將多個學習器進行結合，

JAVAscript學習筆記 jsBOM 第七節 （原創） 參考js使用表

span aid cat alert 當前頁 config 彈出框 pan 針對 <html> <head> <title>day02_js</title> <scrip

強化學習（RLAI）讀書筆記第七章n步自舉（n-step Bootstrapping）

第七章：n-step Bootstrapping 這一章中我們把蒙特卡洛演算法(MC)和一步差分演算法(one-step TD)統一起來。MC演算法和一步TD演算法都不可能永遠是最好的。這兩個方法都是比較極端的形式，可能使用它們中間形式會更好一些。另一個看待n步TD演算法的優勢的角度是它解決了固

《機器學習》 周志華學習筆記第七章 貝葉斯分類器（課後習題）python 實現

課後習題答案 1.試用極大似然法估算西瓜集3.0中前3個屬性的類條件概率。 好瓜有8個，壞瓜有9個 屬性色澤，根蒂，敲聲，因為是離散屬性，根據公式（7.17） P(色澤=青綠|好瓜=是) = 3/8 P(色澤=烏黑|好瓜=是) = 4/8 P(色澤=淺白|好瓜=是) =

PMBOK(第六版) PMP筆記——《七》第七章（專案成本管理）

第七章 專案成本管理 1、規劃成本管理：制定成本管理計劃，用來指導後續的專案成本管理工作。 2、估算成本：估算各項進度活動的成本。 3、制定預算：把估算成本過程得出的各活動或工作的成本逐層向上彙總，建立成本基準。 4、控制成本：監督專案成本績效，管理成本基準變更。 估算成本：

js設計模式第七章 語言之魂——原型模式 讀書筆記

原型模式：用原型例項指向建立物件的類，使用於建立新的物件的類共享原型物件的屬性以及方法。 基於原型鏈實現物件之間的繼承，這種繼承是基於一種對方法或屬性的共享，而不是對方法和屬性的複製。 原型模式就是將可複用的、可共享的、耗時大的從基類中提出來然後放在其原型中，然後子類通過組合繼承或者寄生組合

《Java多執行緒程式設計實戰》——第七章Producer-Consumer（生產者／消費者）模式

Producer-Consumer模式的核心是通過通道對資料（或任務）的生產者和消費者進行解耦，從而使二者的處理速率相對來說互不影響。 類圖 BlockingQueueChannel: 當佇列滿時，將當前執行緒掛起直到佇列非滿 當佇列為空時，將當前執行緒掛起直到佇列

讀書筆記：LearningPython第五版 （第七章 字串基礎）

重點 對string的多次操作，不如先變成list，再join回去效能更好 兩種formatting的大致使用： 表示式方式也可以設定keyword，傳字典； format方式可以引用[]和. C

劉軍《社會網路分析導論》閱讀筆記（5）---第七章（規則對等性）

規則對等性引入 用著色方式引出規則對等性 規則對等性的測量 基本概念 一個圖中節點的型別總共可分成四類： 1.源點：無入度，有出度。 2.中介點：有入度，有出度。 3.終點：有入度，無出度。 4.孤立點：無入度，無出度。 按照上述四種點的分類，

Vue.js實戰筆記Day1（vue-cli）

最近要弄一個單頁面應用，於是乎就想到了vue.js，但網上關於vue.js的教程都是一些簡單的資料互相繫結demo，所以最後買了慕課網的實戰教程學習，同時結合 《官方文件》 以下是我的學習筆記。 1 Vue-cli 簡介與安裝 通常建立一個專案，一般的玩