jdreact轉換為H5注意事項

2022-02-02 05:02:46 字數 2679 閱讀 6711

1:先執行npm install 然後執行 npm run web-init  配置完後 在執行 npm run web-start(注意的是不要根據文件執行

yarn add -d @jdreact/jdreact-core-web
2:本地獲取使用者資訊:在 index.tpl.vm檔案中修改

window.global_config 的pin:

注意的是,最後要改回來!!

(function() ;

}())

3:呼叫後端介面,需在 根據右上角 文件 ,按照步驟一步步來:

然後審批之後,申請後端授權,

注意先登入,且登入人和所傳的user_pin一致

5:輸入框 讓其主動獲取焦點的時候,需要注意的是防止按鈕的冒泡事件,導致游標閃爍一下然後離開輸入框,因為jdreact中的onpress事件不是click事件;

_clearcontact(event),0);

*/},

這兩種方法均可!

6:web與手機端的獲取refs不同:

platform.os == 'web' ? this.refs.telinput.refs.input.blur() : this.refs.telinput.blur();

7:轉成h5之後 帶有間隔的**輸入框出現問題,(用單獨的頁面復現一下這個問題)

settimeout(()=>,100);
8:改變title

componentdidmount(),100);}},

9:路由分平台書寫

if(platform.os == 'web'));

}else

}//下乙個頁面的

)}

其中web端:物件資料傳遞時,需要json.stringify(), 接收資料時,需要json.parse(decodeuricomponent(this.props.datas)),

基本資料型別傳遞和接收的時候不用轉

const = platform.os === 'web' ? json.parse(decodeuricomponent(this.props.datas)) : this.props.datas;

10:字串和boolean的區分

11:資料傳遞和儲存用asyncstorage

12:jdtouchable使得點選之後的樣式發生變化,(如果不設定邊框寬度的話):

},應該給border設定寬度為0:

alignitems: 'center',

flex:1,

height: jddevice.getrpx(118),

borderrightwidth: jddevice.getdpx(1),

borderbottomwidth: jddevice.getdpx(1),

bordertopwidth: jddevice.getdpx(0),

borderleftwidth: jddevice.getdpx(0),

bordercolor: '#ececec',

},樣式為:

13:修改配置檔案

14:iphone 5 se 對max-height 以及 div不設定固定的高度和寬度就不是塊級別的元素

對於max-height必須放在 jdscrollview上,而不能放在view上

15:不能和合用,否則點選jdconfirmdialog中的input輸入框時,iphone5 se中會在鍵盤前增加一塊白塊

16:去掉生成的js檔案的hash值,避免一直改動名稱,方便除錯:在檔案webpack.donfig.prod.js中去掉hash

output: ,

17優惠券頁 區域高度超出後會導致雙滾動條的出現,

方法一:需設定overflow:hidden;

方法二:確保內部元素高度不超過外部元素

如cardboxright:,

componentdidmount()}},

19: rn呼叫手機通訊錄,require在h5下require提公升會報錯,所以使用.web、.ios、.android三個檔案

20:push popto等路由資訊改成資料儲存,重新渲染頁面

移動端h5開發注意事項

移動端h5開發注意事項 1.開發時小比較多,所以我使用絕對定位的次數比較多,絕對定位時盡量根據top進行定位,bottom定位在移動端下方出現時橫條時,會讓樣式錯亂。2.布局方面我是用的是rem 查詢 我看也有用寫一段js指令碼實現rem的,這種方式在一定條件很精準,但在螢幕很寬而長度很短時會有一點...

H5編寫移動端注意事項

在編寫移動端網頁時需要注意如下幾點 首先,在建立好的 html 頁面中需要設定 viewport 單位的使用 首先我們需要明白一些單位作用 px一般都是固定的大小 em是參考其父級元素的font size所設定的值 因此,首行縮排經常會用到 text indent 2em rem則是參考的html下...

h5課件製作 H5課件製作的注意事項

企業將培訓中的重點難點利用h5課件製作成學習課件,方便學員隨時隨地的瀏覽學習,讓學員自主學習獲得最佳效果。隨著h5課件廣泛應用在教學中,製作h5課件已成為教學常態,那麼,在h5課件製作時候有哪些注意事項呢?h5課件和線下的課件有什麼不同呢?下面思創來一一跟大家解讀!1 要具有美感 內容是h5課件的主...