028-85523238

    合作從這里開始

    我們專注:網站設計、移動應用、系統開發、網站SEO及網站營銷及品牌策略與設計

    主營業務:官網建設、微信小程序開發、H5、手機移動APP、信息報送平臺、各類管理系統、云產品·運維解決方案

    您有項目想和我們談談嗎?

    可以通過填寫右邊的表格,讓我們了解您的項目需求,這是一個良好的開始,我們將會盡快與您取得聯系。當然也歡迎您給我們 發送郵件或是電話,讓我們聽到您的聲音

    微信掃一掃 創企全知道

    深入溝通,只為更深度的合作

    創企科技 > 首頁 > 建站知識
    08
    Jun.

    小程序開發需要關注的幾個知識點


    內容主要涉及到小程序相關的五個方面。

      1、Text組件

      2、單位(RPX)

      3、生命周期

      4、template模板

      5、播放器插件

      逐一來看一下。

      一、Text組件

      小程序中view組件的使用相當于就是一個div標簽,而text組件相當于就是一個文本標簽b/span這樣子,然而,其實一段文字我們可以使用text組件來包裹,也可以不用text組件而直接使用view組件來包裹,那二者有什么區別呢?

      很明顯,小程序給TEXT組件賦予了特殊能力。而且使用TEXT組件包裹文件更容易控制它的樣式。所以,通過一些個對比和測試,我對text組件的認識就是兩點:

      1、用TEXT組件包裹的內容好寫樣式,來控制它的顯示UI。

      2、在小程序中只有TEXT包圍的文本才可長按選中,這一點小程序給text組件賦予了一個屬性。
      二、單位RPX

      談一下我對RPX這個單位的認識, 小程序特有的一個單位。首先,小程序開發可以看成是一個移動web的開發。 竟然是一個移動端的開發,那么我們就應該用移動端的思維去寫代碼,就移動端有一些特殊的特征需要我們去考慮,比如:

      1、最重要的!,如何在不同的機型上做適配。

      2、模擬器ip6分辨率375和設計稿750的因為所以然關系。

      這張圖我已經在多個地方講過了,通過這張圖我們可以知道,模擬器ip6的375是一個邏輯分辨率的概念,單位可以認為是PT,它和我們日常布局中的CSS像素在數值大小上是同一個東西,而物理分辨率(如上750*1334)才是設備真正分辨率的概念,它和前面說的邏輯像素數值上有一個對應的關系(Reader)。也就是表示一個邏輯像素包含幾個物理像素問題。知道了這些之后,我們就來看一下小程序序里RPX那點事。

      我們來看一下RPX的作用,看它解決了一個什么問題。

      1、ip6下1px =1rpx=0.5pt

      這里說的PX指的是物理分辨率1px。這個就是小程序的規定,以ip6的物理像素750X1334為視覺稿進行設計,只不過小程序定了個不一樣的單位叫RPX(responsive pixel)。然而,使用RPX,小程序會自動在不同的分辨率下進行轉換。從而達到適配的效果。

      小程序開發需要關注的幾個知識點

      可以理解:小程序中的RPX相當于就是移動端開發中PX/rem/em等單位用來表示視覺上與設備分辨率上的一個邏輯關系 。

      2、不是所有的單位都適合用rpx。

      RPX是會根據不同機型去做自適應調整的,而有時候我們不需要去做這么一個調整。

      比如,對于一些個文字介紹,使用RPX后,小屏幕看起來就完全不可控,顯示效果上看著比較小,甚至出現看不清楚的情況,還有一些標題的情況,可能我們在任何機型上想要看到的就是一個加粗定大的效果。這種情況下,其實我覺得我們還是可以使用PX作為單位來控制比較適合一些。

      三、生命周期

      小程序也有生命周期,其實整個開發流程和前端框架React/vue等都類似,所以,這個我對比著來看一下小程序中的生命同期的概念。

      對于那些對外暴露的方法,onLoad/onShow/onReady都好理解。在頁面初始化數據的處理方式上有一點需要注意的地方:

      1、在React框架

      實際上跑完willmount之后會產生render,然后在執行didmount,如果在didmount中如果有數據發生變化,使用setState處理變化后,再去執行render。

      在willmount中我們可以使用this.state.xxx來初始化變量的值。

      2、小程序架構

      然而,在小程序的生命周期內,我們是否可以在onLoad中使用this.data.xxx來初始化變量呢?

      答案是不行的,可能之前的版本是可以的,查了一下小程序文檔。

      四、template

      WXML提供模板(template),可以在模板中定義代碼片段,然后在不同的地方調用。

      模板的使用非常簡單,文檔中的說的很清楚,那么關于這個清楚的描述,我對模板有兩點認識:

      1、區別于腳本引入可以使用絕對路徑

      腳本的引入是只能使用相對地址的,而模板的引入可以使用絕對路徑。

      2、模板化不是模塊化

      有沒有發現在模板文件中其實少了一個文件,shipin-item-template.js,對,這里是不能加這個腳本文件的,所以從業務角度上來說,無法將邏輯單獨出來。因此,小程序時原模板只是一個模板不是一個模塊。

      五、播放器插件

      小程序插件功能是前端不久開放出來的,對于它的認識談一下申請流程。


    在線咨詢客服>>

    本文標簽: 小程序開發

    我們能做什么

    致力于互聯網品牌建設與網絡營銷,專業領域包括網站建設、 電子商務、移動互聯網應用、系統平臺開發,等服務為不同 類型的客戶提供良好的互聯網應用定制解決方案,幫助客戶 在新的全球化互聯網環境中保持優勢。

    我們的優勢

    • 10年專業互聯網服務經驗
    • 時刻全新技術領先研發能力
    • 成都專業建站團隊
    • 具有完備的項目管理
    • 資深行業分析策劃
    • 完善的售后服務體系
    • B2C營銷型網站建設領先者
    • 深厚的網絡運營經驗
    • 先前沿視覺設計、研發能力

    關于創企科技

    創企科技提供網站建設開發(含APP)、品牌咨詢策劃、 整合營銷推廣等互聯網全價值鏈一體化服務。核心團隊 由互聯網專業人士和營銷專業人士構成,具有10年系統 設計開發經驗,6年整合營銷實際操盤經驗。

    相關推薦

    請填寫您的項目需求給我們

    請認真填寫需求信息,我們會在24小時內與您取得聯系

    * * *

    *

    提交
    亚洲色精品三区二区一区| 国产精品亚洲精品日韩已满| 亚洲精品视频在线看| 亚洲自国产拍揄拍| 亚洲综合精品一二三区在线| 亚洲国产成人精品无码区在线观看| 国产精品xxxx国产喷水亚洲国产精品无码久久一区 | 国产亚洲综合久久系列| 国产亚洲午夜高清国产拍精品| 亚洲А∨精品天堂在线| 国产成人高清亚洲一区91| MM1313亚洲精品无码久久| 亚洲hairy多毛pics大全| 亚洲精品国产综合久久久久紧| 亚洲人成网站999久久久综合| 亚洲一线产品二线产品| 亚洲欧美日本韩国| 亚洲av乱码中文一区二区三区| 亚洲av日韩av永久在线观看| 男人的天堂av亚洲一区2区| 中文字幕在线日亚洲9| 亚洲不卡中文字幕| 亚洲色偷偷综合亚洲av78| 亚洲精品色播一区二区 | 亚洲精品少妇30p| 国产亚洲综合一区柠檬导航| 亚洲爆乳无码专区| 亚洲一区二区中文| 中文字幕亚洲色图| 亚洲一级毛片免费在线观看| 亚洲日韩国产精品乱-久| 亚洲色偷偷偷综合网| 一本久到久久亚洲综合| 久久久精品国产亚洲成人满18免费网站 | 久久久久噜噜噜亚洲熟女综合| 国产亚洲精品高清在线| 亚洲精品国产精品乱码在线观看| 久久久久亚洲AV片无码| 亚洲精品美女久久久久| 丁香婷婷亚洲六月综合色| 亚洲youwu永久无码精品 |