1. 程式人生 > >vuejs及相關工具介紹

vuejs及相關工具介紹

輕量級前端mvm的框架


圖片.png
圖片.png

對es6語法的簡單描述

圖片.png
圖片.png

融合了react和angular的優點,元件化和靈活應用和指令,在國際上是一款極有潛力的前端框架。
1.雙向繫結
兩段相加得到後面頁面的渲染,{{message}}是常見頁面模板的渲染方式。
v-model 的意思是將 新建new Vue裡面data的message的欄位關聯到input裡面。
相反,input框裡的數值的變動,也會帶動message裡面的變化,這就是所謂的雙向繫結。


圖片.png
圖片.png

頁面中的三種元素HTML,Javascript,css寫到一個Vue檔案裡,檔案的字尾名是.vue

圖片.png
圖片.png

vue字尾的檔案在打包是,能夠被轉換成傳統HTML就能識別的模式,<template></template>裡面的內容就是傳統的HTML

圖片.png
圖片.png