成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

微信小程序開發(fā)-個(gè)人總結(jié)

FrancisSoung / 2011人閱讀

微信小程序開發(fā)總結(jié) 
基礎(chǔ)的配置及視圖層、邏輯層自己看文檔  [微信小程序文檔][1]

這里只說一下自己的經(jīng)驗(yàn)總結(jié)
提醒 
微信小程序不運(yùn)行在瀏覽器，所以不能操作Dom，也沒有document、window對(duì)象
每一個(gè)頁面路徑最多五層
eg：頁面A->頁面B->頁面C->頁面D->頁面E->（頁面F是跳轉(zhuǎn)不出來的）
注：不經(jīng)過redirect，redirect后的頁面算是第一層，但是沒有-返回-按鈕
沒有外鏈，只能用app.json里配置的路由，a標(biāo)簽編譯時(shí)會(huì)自動(dòng)過濾掉
wx:for循環(huán)渲染時(shí)，要添加wx:key，否則報(bào)警告
使用做x軸滾動(dòng)時(shí)，要設(shè)置height屬性，否則開發(fā)工具買賬，手機(jī)可不慣著你
給視圖綁定數(shù)據(jù)時(shí)，只有事件綁定、wx:key、wx:for-index、wx:for-item，直接綁定，不需要{{}}，其它綁定都要在{{}}里綁定
app.json里的pages，最好是按照，層級(jí)順序進(jìn)行配置，要不然可能不會(huì)跳轉(zhuǎn)
使用touchstart、touchend時(shí)，最好不要阻止冒泡，會(huì)影響子級(jí)的tap事件，touchmove最好阻止冒泡，防止影響父級(jí)scroll-view
使用input時(shí)，最好在bindinput中動(dòng)態(tài)設(shè)置value，否則安卓真機(jī)會(huì)出問題
視圖元素單位 
設(shè)計(jì)時(shí)最好讓ui做成750px，開發(fā)中，ui是多少px，你寫成多少rpx就OK了，原理，自己查文檔去
頁面?zhèn)鲄?/b> 


Page({
    onLoad (opositions) {
        // 看看是不是你想要的
        console.log(opositions.id)
    }
})
視圖響應(yīng) 
每個(gè)頁面都有一個(gè)Page實(shí)例，響應(yīng)就是該實(shí)例的setData方法觸發(fā)的，
*直接給綁定數(shù)據(jù)賦值，數(shù)據(jù)會(huì)改變，但是視圖不會(huì)渲染

js文件

    let config = {
        data: {}
    }
    Page(config)
事件綁定 
wxml文件

    

js文件

    let config = {
        data: {},
        tapHandler () {
            console.log("i am a handler")
        }
    }

bindtap的綁定最終會(huì)解析成方法名，所以bindtap=“tapHandler(參數(shù))”，是會(huì)報(bào)錯(cuò)的，----沒有找到‘tapHandler(參數(shù))’這個(gè)方法，
好在，執(zhí)行事件綁定函數(shù)時(shí)，會(huì)給它傳遞一個(gè)參數(shù)，參數(shù)里能取到，id、data-set，可以用他們倆綁定屬性，不要企圖找name、class等屬性，沒用的，沒有

公用組件

組件分三個(gè)文件，wxml、js、css

wxml文件定義template模版，頁面里以import方式引入，這樣能控制傳入模版的數(shù)據(jù)
js文件exports一個(gè)對(duì)象，頁面里以require方式引入，并且合并到Page實(shí)例化的配置對(duì)象中

    let tempateConfig = require("url")
    let mergeConfig = require("url/wxTools.js")["mergeConfig"]

    let config = {
        data: {}
    }
    config = mergeConfig(config, templateConfig)
    Page(config)

mergeConfig是自己定義的簡單的對(duì)象合并函數(shù)，支持多層，多對(duì)象合并
Object.assign()方法在安卓真機(jī)上運(yùn)行報(bào)錯(cuò)，不能用

wxTools.js
    
    function merge (con, mcon) {
        for (var key in mcon) {
            if (typeof mcon[key] == "object" && con[key]) {
                merge(con[key], mcon[key])
            } else {
                con[key] = mcon[key]
            }
        }
    
        return con
    }
    
    function mergeConfig () {
        let config = {}
        for (var i = 0, len = arguments.length; i < len; i++) {
            config = merge(config, arguments[i])
        }
        return config
    }
    
    module.exports = {
        mergeConfig: mergeConfig
    }

css文件以@import方式導(dǎo)入
開發(fā)技巧

1.錨點(diǎn)
的url只能是app.json里配置的路由，只支持查詢字符串，不支持hash，所以不能通過鏈接做錨點(diǎn)了。
還好微信提供了,實(shí)現(xiàn)如下：

wxml文件

    
        
        
    
    
        
        
    

js文件

    Page({
        data: {
            toView: "hash1"
        },
        goHash (e) {
            let hash = e.currentTarget.dataset.hash
            this.setData({
                toView: hash
            })
        }
    })

但是這是單向的，只能點(diǎn)擊按鈕，跳轉(zhuǎn)錨點(diǎn)，屏幕滑動(dòng)到相應(yīng)錨點(diǎn)，toView屬性不會(huì)相應(yīng)改變，當(dāng)然，如果你能通過bindscroll事件動(dòng)態(tài)取到的相關(guān)數(shù)據(jù)，并且最終能把toView計(jì)算出來，就另說了，但不要想操作dom獲取元素寬高什么的，對(duì)不起，微信的dom賣完了，沒有

2.滾動(dòng)加載
微信沒有document、window對(duì)象，所以沒有onscroll給你用，那怎么辦呢？
還好微信提供了,實(shí)現(xiàn)如下：

wxml文件

    
        
            {{item.name}}
        
    

js文件

    Page({
        data: {
            movies: []
        },
        getMovies () {
            let _self = this
            wx.request({
              url: "https://......",
              data: {},
              success: function(res) {
                // res.data才是你后端返回的真實(shí)數(shù)據(jù)
                _self.setData({
                    movies: res.data
                })
              }
            })
        },
        loadMovies () {
            // 得到要更新的數(shù)據(jù)，setData重置movies
        }
    })

可以做懶加載，也可以做預(yù)加載，具體邏輯自己想吧

暫時(shí)就這些啦。。。最后抱怨一句，咋就不支持外鏈呢，引共用組件咋那么麻煩呢

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/86528.html

相關(guān)文章

  • 微信小程序開發(fā)-個(gè)人總結(jié)

    微信小程序開發(fā)總結(jié) 基礎(chǔ)的配置及視圖層、邏輯層自己看文檔 [微信小程序文檔][1] 這里只說一下自己的經(jīng)驗(yàn)總結(jié) 提醒 微信小程序不運(yùn)行在瀏覽器，所以不能操作Dom，也沒有document、window對(duì)象 每一個(gè)頁面路徑最多五層 eg：頁面A->頁面B->頁面C->頁面D->頁面E->（頁面F是跳轉(zhuǎn)不出來的） 注：不經(jīng)過redirect，redirect后的頁面算是第一層，但是沒有-返回-按鈕...

    derek_334892 評(píng)論0 收藏0

  • 微信小程序開發(fā)-個(gè)人總結(jié)

    微信小程序開發(fā)總結(jié) 基礎(chǔ)的配置及視圖層、邏輯層自己看文檔 [微信小程序文檔][1] 這里只說一下自己的經(jīng)驗(yàn)總結(jié) 提醒 微信小程序不運(yùn)行在瀏覽器，所以不能操作Dom，也沒有document、window對(duì)象 每一個(gè)頁面路徑最多五層 eg：頁面A->頁面B->頁面C->頁面D->頁面E->（頁面F是跳轉(zhuǎn)不出來的） 注：不經(jīng)過redirect，redirect后的頁面算是第一層，但是沒有-返回-按鈕...

    philadelphia 評(píng)論0 收藏0

  • Java 初學(xué)者做的第一個(gè)微信小程序總結(jié)--關(guān)于Java基礎(chǔ)

    摘要：官方資料微信公眾平臺(tái)注冊小程序。官網(wǎng)開發(fā)文檔社區(qū)開發(fā)工具部署微信小程序微信小程序本身不需要部署，在微信開發(fā)工具中直接上傳代碼就行。 為什么 學(xué)習(xí) Java 三年，目前已經(jīng)工作了2年，因?yàn)樽詫W(xué)，基礎(chǔ)差，所以打算年末總結(jié)一下常見的基礎(chǔ)知識(shí)和面試點(diǎn)； 也可以通過獨(dú)立做一個(gè)項(xiàng)目整合自己工作期間學(xué)習(xí)的知識(shí)，加深印象。 但是想著回家或是平時(shí)手機(jī)用的多，做一款A(yù)PP和小程序很方便查看。 項(xiàng)目展示 本...

    mudiyouyou 評(píng)論0 收藏0

  • 微信小程序開發(fā)踩坑總結(jié)（持續(xù)完善中）

    摘要：由于個(gè)人技術(shù)水平有限，在問題描述，解決方案中存在的問題，希望可以得到各位前輩的指點(diǎn)。本篇主要是記錄我在開發(fā)微信小程序中遇到的問題。各記錄點(diǎn)排序，跟隨自己開發(fā)過程中的問題出現(xiàn)時(shí)間而定。。微信小程序數(shù)據(jù)頁面數(shù)據(jù)傳遞總結(jié) 由于個(gè)人技術(shù)水平有限，在問題描述，解決方案中存在的問題，希望可以得到各位前輩的指點(diǎn)。本篇主要是記錄我在開發(fā)微信小程序中遇到的問題。各記錄點(diǎn)排序，跟隨自己開發(fā)過程中的問題出現(xiàn)...

    tianhang 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

FrancisSoung

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<