原创 Mixin 和 CSS Guards

當我們想在表達式上進行匹配簡單的值或者是參數數量時,我們可以使用Guards;它與mixin聲明相關聯,幷包括附加到mixin的條件。每個mixin將有一個或多個由逗號分隔的防護,並且guard必須括在括號中。  爲了儘量接近CSS的聲明性

原创 React 知識點整理

元素的渲染 什麼是 React 元素 元素是構成 React 應用的最小單位,用 ReactDOM.reader() 方法渲染。 元素是普通的 js 對象,是構成組件的一個部分。 創建 React 元素 使用 JSX 語法:cons

原创 Vue單元測試

單元測試,就是爲了測試某一個類或者是某一個方法能否正常工作而寫的測試代碼。 關於單元測試 是什麼:單元測試是針對 程序的最小單元 來進行正確性檢驗的測試工作。就是測試某一個頁面或者是某一個方法來進行測試的代碼單元。 意義:可以減少bug,提

原创 自定義指令

基礎簡介 除了核心功能默認的內置指令(v-model和v-show),vue也允許註冊自定義指令。注意,在Vue2.0中,代碼複用和抽象的主要形式是組件,但是在有些情況下,我們需要對普通的DOM元素進行底層操作,這時候就需要我們用到自定義指

原创 Vue.js 動畫

組件的過渡 條件的渲染(使用v-if) 條件的展示(使用v-show) 動態組件 組件根節點 鏈接地址下載: <script src="http://raw.githubusercontent.com/daneden/animate.c

原创 vue 渲染函數

使用方法 v-if : <h1 v-if="xkd">俠課島</h1> template 中配合 v-if 條件渲染一整組 : <template v-if="a"> <h1>Title</h1> <p>Paragraph

原创 可複用性和組合

可複用性和組合就是將組件可複用性的使用和組合這個組件。 可複用性和組合 我們可以新建一個index.html和index.js,在index.html中引入index.js,然後在index.html中寫入代碼: <body> <d

原创 Vue-cli 單文件組件

什麼是vue-cli單文件組件 vue-cli 是官方提供的一個腳手架工具,它可以快速的生成vue的項目模板。 官方網址:http://www.npmjs.com/package/... 主要功能 提供了一個規範的目錄結構 本地調試 代碼

原创 Vue 路由的配置

什麼是路由 vue路由是可以通過組件的形式把所有的組件組裝成爲一個應用程序,當我們需要的時候,將這個組件映射到路由,然後告訴Vue 我們在哪裏渲染它們。 路由是我們瀏覽器的一個地址。 vue路由的優缺點 當我們加載一個程序時,由於它加載的內

原创 Vue組件

組件的使用 <!DOCTYPE html> <html> <head> <title>組件</title> <script src="Vue.min.js"></script> <script> w

原创 Vue內置指令的使用

v-model(數據綁定) v-model常用於表單數據的雙向綁定,它本質上是一個語法糖。它主要的有兩種應用: 在文本框、多行文本、input的下拉框、單選按鈕、複選框中的應用 <div id="app"> <input v-m

原创 Vue模板語法、事件和表單使用

模板語法 文本綁定,兩個大括號,中間加上data裏面的數據,message裏面不僅可以是變量還可以是表達式 <body> <div id="main"> // 變量 {{ message }}

原创 Vue的屬性、方法、生命週期

實例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" co

原创 Vue 初體驗

引入Vue Vue文件地址: <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script> Vue雛形 代碼: <html lang="en"

原创 認識Vue

vue是什麼 Vue (讀音 /vjuː/,類似於 view) 是一套用於構建用戶界面的漸進式JavaScript框架。 與其它大型框架不同的是,Vue 被設計爲可以自底向上逐層應用。Vue 的核心庫只關注視圖層,方便與第三方庫或既有項目整