站長資訊網(wǎng)
        最全最豐富的資訊網(wǎng)站

        uni-app如何引用npm第三方庫

        uni-app引用npm第三方庫的方法:首先下載第三方庫;然后創(chuàng)建【uni-app】工程;最后在【uni-app】里面使用第三方庫,代碼為【import * as echarts from 'echarts'】。

        uni-app如何引用npm第三方庫

        本教程操作環(huán)境:windows7系統(tǒng)、uni-app2.5.1版本,該方法適用于所有品牌電腦。

        推薦(免費):uni-app開發(fā)教程

        uni-app引用npm第三方庫的方法:

        1. 下載第三方庫

        uni-app 使用了 mpvue 的部分代碼,所以我們的 echarts 庫使用兼用 mpvue 版本的 mpvue-echarts,同時需要引用百度的 echarts。

        下載流程如下:

        • 創(chuàng)建一個空的文件夾如:test-echarts。

        • 進入 test-echarts 打開命令行工具,執(zhí)行 npm init 一路回車即可。

        • 下載第三方庫:npm install echarts mpvue-echarts –save。

        • 進入 node_modules 目錄,里面的三個目錄:echartsmpvue-echatszrender就是我們需要的第三方庫。

        2. 創(chuàng)建uni-app工程

        在 HBuilderX 里面新建 uni-app,將將剛才下載的三個文件夾拷貝到項目根目錄,最終項目截圖如下:

        uni-app如何引用npm第三方庫

        3. 在uni-app里面使用第三方庫

        和一般的 vue 項目引用第三方庫的方法一樣,如下所示,這樣我們就能在工程里面使用 echarts 和 mpvue-echarts 了。

        import * as echarts from 'echarts'   import mpvueEcharts from 'mpvue-echarts'

        本示例源碼在附件工程里面,下面是部分代碼和效果截圖:

        <template>       <div class="container">           <mpvue-echarts :echarts="echarts" :onInit="onInit" />       </div>   </template>   <script>       import * as echarts from 'echarts'       import mpvueEcharts from 'mpvue-echarts'       function initChart(canvas, width, height) {           ......       }       export default {           data() {               return {                   echarts,                   onInit: initChart               }           },           components: {               mpvueEcharts           }       }   </script>   <style>       .container {           flex: 1;       }   </style>

        uni-app如何引用npm第三方庫

        贊(0)
        分享到: 更多 (0)
        網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號
        主站蜘蛛池模板: 国产综合精品一区二区三区| 五月花精品视频在线观看 | 亚洲国产精品18久久久久久| 青青青青久久精品国产h| 亚洲国产成人一区二区精品区| 精品99久久aaa一级毛片| 久久精品国产亚洲沈樵| 久久精品国产亚洲AV无码偷窥| 日韩精品成人亚洲专区| 国产精品免费一区二区三区| 国内精品在线视频| 精品福利一区二区三区免费视频| 亚洲乱码日产精品a级毛片久久| 国产精品亚洲综合一区| 2021年精品国产福利在线 | 亚洲午夜精品第一区二区8050| 国产亚洲精品精品国产亚洲综合| 欧美巨大黑人精品videos| 国产国产成人精品久久| 国精品午夜福利视频不卡麻豆| 久久久久久九九99精品| 老司机午夜精品视频资源| 日韩精品中文字幕无码一区| 野狼第一精品社区| 亚洲精品tv久久久久| 日韩人妻无码精品无码中文字幕 | 国产一区二区精品久久岳| 国产高清一级毛片精品| 亚洲国产精品一区二区久久| 2022国产精品最新在线| 99精品在线免费| 国产成人亚洲精品影院| 一级香蕉精品视频在线播放| 亚洲欧美日韩精品永久在线| 92精品国产自产在线观看| 99久久精品国产综合一区| 99久久www免费人成精品| 国产高清在线精品一区小说 | 亚洲欧美精品AAAAAA片| 亚洲av永久无码精品网站| 亚洲AV午夜福利精品一区二区 |