• <pre id="y08ey"><del id="y08ey"><xmp id="y08ey"></xmp></del></pre>
    1. <pre id="y08ey"></pre>
      
      <p id="y08ey"><strong id="y08ey"><small id="y08ey"></small></strong></p>
      <td id="y08ey"><ruby id="y08ey"></ruby></td>
      <p id="y08ey"><strong id="y08ey"><xmp id="y08ey"></xmp></strong></p>
      <pre id="y08ey"></pre>

      <table id="y08ey"></table>
        <track id="y08ey"></track>
      1. 手機: 18919834768
        電話熱線: 0931-7603702
        網站知識
        當前位置: 主頁 > 網站知識

        vue3中組件的概念

        發布時間:2023-02-20 21:43:33???來自:未知???編輯:蘭州啟點網絡 www.syzhibo.net

        學習要點:
        1.組件概念
        2.簡單組件
        本節課我們來開始學習 Vue3.x 的組件的基本概念以及簡單的使用;
        一.組件概念
        1. 組件是一種封裝可復用的集合,通過組件化,將更好的完成繁雜的需求;
        2. 從已知的概念中理解:類似函數或方法封裝的重復代碼,或 HTML 的代碼塊引入;
        3. 組件化特點,具體如下:
        (1) .擁有唯一性的組件名稱,方便調用;
        (2) .以組件名稱為 HTML 元素標簽形式存在,擴展了 HTML;
        (3) .組件可以復用,且組件與組件之間互不干涉;
        二.簡單組件
        1. 為了方便理解,我們清理掉之前的全部代碼,重新編寫如下:
        // 創建一個 Vue 應用實例
        const app = Vue.createApp({})
        // 定義一個全局組件
        app.component('button-counter', {
        // 數據
        data() {
        return {
        counter : 100
        }
        },
        // 模板
        template : `
        計算器:{{counter}}
        counter++

        `
        })
        // 掛載
        app.mount('#app')
        2. 而對于 HTML 調用的部分,可復用的能力體現出來,如下:
        <div id="app">
        <button-counter>button-counter>
        <button-counter>button-counter>
        <button-counter>button-counter>
        div>
        本文由:蘭州啟點網絡(www.syzhibo.net)整理發布!

        ? QQ咨詢

        建站咨詢 售前咨詢 私人訂制 售后技術

        ? 電話咨詢

        0931-7603702
        (早9:00-晚10:00)

        ? 微信咨詢

        掃碼關注
        點點租

        ? 返回頂部
        午夜无码区在线观看_久久精品国产亚洲一区二区_久久综合日本久久综合88_在线观看国产一区