原创 canvas09:lineJoin屬性與設置折線拐點樣式

lineJoin:設置兩條線相交的拐點的樣式。屬性值爲“bevel”、“round”、“miter”。 屬性值 作用 bevel 創建斜角 round 創建圓角 miter 默認,尖角 案例:        繪製三條折線,並設置不同的拐點

原创 vue的基本內置指令

1.插值表達式 {{}} 作用:將vue數據模型中的數據顯示到視圖層中,只能使用在雙向標籤中間 例子:<p>{{name}}</p> 2.v-text 作用:將vue數據模型中的數據顯示到視圖層中,定義在開始標籤中,單向標籤和雙向

原创 vue生命週期beforeCreate()前做了什麼

概念 當我們執行 new Vue()開始到被創建完成,vue需要設置數據監聽、編譯模板、將實例掛載到 DOM 並在數據變化時更新 DOM 等。同時在這個過程中也會運行一些叫做生命週期鉤子的函數,這給了用戶在不同階段添加自己的代碼的

原创 vue生命週期created()前做了什麼

我們在做項目時,通常會在組件created()鉤子函數中請求後端接口,得到數據後渲染視圖,這樣可以達到切換到對應頁面,即可顯示後端數據。 問題: vue生命週期created()前做了什麼? 我們可以看到,官網上給出的是,cre

原创 報錯解決: Uncaught SyntaxError: Unexpected token < in JSON at position 0

在js中獲取php頁面json數據的時候報錯:點開報錯連接,提示的是獲取的時候報錯:當時php代碼如下,一直沒看出來有什麼毛病,後來寫了個測試代碼,直接打印$data的值, <form action="test.php">        

原创 canvas08:lineCap屬性與繪製線兩端樣式

lineCap:用於繪製線條兩端的樣式。屬性值有“butt”、“round”、“square”。  屬性值 作用 butt 默認,線條的兩端爲平行的邊緣 round 向線條的兩端添加半圓形線帽 square 向線條的兩端添加正方形線帽 案

原创 css基礎選擇器說明

css選擇器分爲基礎選擇器與複合選擇器。複覈選擇器由基礎選擇器通過不同方式組合成。選擇器主要是爲了對頁面標籤進行一對一、一對多、多對一的樣式控制。書寫格式爲:選擇器{屬性:值;}基礎選擇器:標籤選擇器       格式:標籤{屬性:值;}

原创 虛擬DOM是什麼?

問題: 什麼是虛擬DOM,我們爲什麼要用它,它與原生DOM有什麼區別? 在瀏覽器的標準裏面,DOM是非常複雜的,我們先寫一段基本的代碼來體現 <script> let div = document.createElem

原创 虛擬DOM如何新建和渲染

上一篇描述了什麼是虛擬DOM。 在React和Vue中,虛擬DOM的創建都是由模板或者JSX來完成的。但是由模板變成render或者JSX完成虛擬DOM的創建都是由webpack的loader來完成。 我們現在就用原生的方法去完成

原创 vue插槽v-slot

1.什麼是slot <app> <menu-main></menu-main> <menu-sub></menu-sub> <div> <app-footer>

原创 Vue路由跳轉時報錯 Cannot read property '$createElement' of undefined

最近在配置路由時,路由跳轉時報錯:“ Cannot read property '$createElement' of undefined”。 問題在於component寫成了components了,修正了就好了。

原创 Vue:[Vue warn]: Failed to resolve directive: changeColor(found in )報錯解決

代碼: // 自定義指令 Vue.directive('changeColor', { inserted: function(el, binding) { el.style.colo

原创 關於: Error in mounted hook: "Error: Component series.line not exists. Load it first

1.報錯如圖 2.解決辦法 在mian.js中,將 import echarts from ‘echarts/lib/echarts’ 改爲 import echarts from 'echarts’

原创 canvas07:非零環繞填充規則與繪製一個鏤空的正方形

1先繪製一個大的正方形 2繪製一個小的正方形,位於大正方形的中部 3.填充後我們會得到什麼圖形? 我們接下來試一下: 代碼: <style> canvas { border: 1px #333 solid;