欧美三级国产三级日韩三级_亚洲熟妇丰满大屁股熟妇_欧美亚洲成人一区二区三区_国产精品久久久久久模特

19-微信小程序商城下單頁(yè)面收貨地址（微信小程序商城開(kāi)發(fā)、小程序畢業(yè)設(shè)計(jì)、小程序源代碼）（黃菊華- - 新聞資訊 - 云南小程序開(kāi)發(fā)|云南軟件開(kāi)發(fā)|云南網(wǎng)站建設(shè)-昆明葵宇信息科技有限公司

159-8711-8523

云南網(wǎng)建設(shè)/小程序開(kāi)發(fā)/軟件開(kāi)發(fā)

知識(shí)

不管是網(wǎng)站，軟件還是小程序，都要直接或間接能為您產(chǎn)生價(jià)值，我們?cè)谧非笃湟曈X(jué)表現(xiàn)的同時(shí)，更側(cè)重于功能的便捷，營(yíng)銷(xiāo)的便利，運(yùn)營(yíng)的高效，讓網(wǎng)站成為營(yíng)銷(xiāo)工具，讓軟件能切實(shí)提升企業(yè)內(nèi)部管理水平和效率。優(yōu)秀的程序?yàn)楹笃谏?jí)提供便捷的支持！

您當(dāng)前位置>首頁(yè) » 新聞資訊 » 小程序相關(guān) >

19-微信小程序商城下單頁(yè)面收貨地址（微信小程序商城開(kāi)發(fā)、小程序畢業(yè)設(shè)計(jì)、小程序源代碼）（黃菊華-

發(fā)表時(shí)間：2020-11-17

發(fā)布人：葵宇科技

瀏覽次數(shù)：162

下單頁(yè)面收貨地址
本節(jié)主要講解下單頁(yè)面中頂部收貨地址界面的實(shí)現(xiàn)。效果如圖14-7所示。
在這里插入圖片描述

1.布局分析

結(jié)構(gòu)布局分析示意如圖14-8所示。
在這里插入圖片描述
根據(jù)上面的布局分析，我們會(huì)產(chǎn)生基礎(chǔ)的框架，代碼示例如下：

<view>
   <image></image>

   <view>
<radio-group>
           <view>
		<radio  value="公司" checked="{{true}}" >黃菊華-13516821613</radio>
<text>杭州市余杭區(qū)東港路118號(hào)雷恩國(guó)際13樓</text>
</view>
           <view>
		<radio  value="家庭" >黃菊華-13516821613</radio>
<text>重慶市忠縣香山路12號(hào)</text>
</view>
       </radio-group> 
</view>        
 
    <view>
           <button size='mini'>新</button>
    </view>
</view>

根據(jù)效果圖分析出框架的層級(jí)后，在每個(gè)層級(jí)的view加上樣式，編碼實(shí)現(xiàn)即可。
? 第1層：定義產(chǎn)品鏈接 navigator，無(wú)需樣式。
? 第2層：定義flex模式，默認(rèn)從左到右排列。
? 第3層：圖片樣式，多行文字的總體排列樣式。

2.功能實(shí)現(xiàn)

.wxml文件代碼示例如下：

  <view class="wx-cells">
   <image class="wx-cell-icon" src="/img/dizhi.png"></image>

   <view class="wx-cell-text">
<radio-group>
           <view>
		<radio  value="公司" checked="{{true}}" >黃菊華-13516821613</radio>
<text>杭州市余杭區(qū)東港路118號(hào)雷恩國(guó)際13樓</text>
</view>
           <view>
		<radio  value="公司" >黃菊華-13516821613</radio>
<text>重慶市忠縣香山路12號(hào)</text>
</view>
       </radio-group> 
</view>        
 
    <view class="wx-cell-arrow">
           <button size='mini'>新</button>
    </view>
</view>

.wxml文件樣式代碼示例如下：

/*收貨地址*/
.wx-cells {
  width: 100%;
  margin-top: 15rpx;
  font-size: 34rpx;
  border-top: 1rpx solid #d9d9d9;
  border-bottom: 1rpx solid #d9d9d9;
  background-color: #fff;
  padding: 10rpx 15rpx;
  display: flex;
  align-items: center;  
}
.wx-cell-icon{
  width: 56rpx;
  height: 56rpx;
}
.wx-cell-text{
  flex: 1;
  margin-left: 30rpx;
}
.wx-cell-arrow{
  width: 100rpx;
  height: 56rpx; 
  margin: 10rpx; 
}
.wx-cell-arrow button{ 
  background:  darkgreen ; 
  color:  white; 
  width: 56rpx; 
  display: flex;
  justify-content: center;
}