[洛谷P2482][題解][SDOI2010]豬國殺
阿新 • • 發佈:2020-12-27
Vue.js是一套構建使用者介面的漸進式框架,採用自底向上增量開發的設計。Vue的核心庫關注於檢視(html),不僅易上手,還便於與第三方庫或專案整合。
漸進式:一步一步,不是將所有的東西都學完才能使用。
自底向上設計:一種設計程式的過程和方法,就是先編寫出基礎程式段,然後在逐步擴大規範、補充和升級某些 功能,實際上是一種自底向上構造程式的過程。
Vue.js的核心是允許採用簡潔式模板語法來宣告的將資料渲染進DOM的系統
在使用資料之前需要先進性宣告才可以使用
<!-- 定義Vue要渲染/控制的部分 --> <div class='app'> <!--使用差值表示式進行渲染 --> <p> {{message}} </p> </div> </body> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> // 建立Vue例項 new Vue({ // 指定Vue要渲染/控制的元素 el: '.app', // 資料 data: { message:'這是通過插值表示式進行渲染的', }, }) </script>
常見的開發模式有MVC、MVP、MVVM。
使用Vue.js實現輸出“Hello World”
步驟:
1、定義用於填充資料的標籤
2、引入Vue.js庫檔案
3、使用Vue語法實現需求
4、將資料填充到“第1步”的標籤裡面
<!-- 定義Vue用於填充資料的標籤 --> <div class='app'> <!-- 使用差值表示式進行渲染 --> <p> {{message}} </p> </div> </body> <!-- 引入Vus.js檔案 --> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> // 建立Vue例項 new Vue({ // 元素怪哉的位置,可以是CSS選擇器,也可以是DOM元素 el: '.app', // 模型資料 data: { message: 'Hello Word', }, }) </script>