欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序開發(fā)實例詳解

 更新時間:2016年09月23日 16:15:13   作者:汗青man  
這篇文章主要介紹了微信小程序開發(fā)實例詳解的相關資料,需要的朋友可以參考下

“小程序”破解IDE + Demo:https://github.com/gavinkwoe/weapp-ide-crack.git
資源匯總:https://github.com/Aufree/awesome-wechat-weapp
官方簡易教程·MINA:http://wxopen.notedown.cn/
Hello小程序 - 非官方:http://www.helloxcx.com
微信應用號開發(fā)教程:https://my.oschina.net/wwnick/blog/750055

資源來自網(wǎng)絡,拿走不謝!

簡單搞了一下,吼吼~:

js:業(yè)務處理

//index.js
//獲取應用實例
var app = getApp()
Page({
 data: {
  motto: 'Hello World',
  userInfo: {name:'汗青',
        desc:"前端的春天來了!\n 前端要爛大街了??!",
     avatarUrl:"http://img2.3lian.com/2014/gif/10/9/25.jpg"}
 },
 //事件處理函數(shù)
 bindViewTap: function() {
  wx.navigateTo({
   url: '../logs/logs'
  })
 },
 onLoad: function () {
  console.log('onLoad')
  var that = this
   //調用應用實例的方法獲取全局數(shù)據(jù)
  app.getUserInfo(function(userInfo){
   //更新數(shù)據(jù)
   that.setData({
    userInfo:userInfo
   })
   that.update()
  })
 }
})

wxml:創(chuàng)建布局

<!--index.wxml-->
<view class="container">
 <view bindtap="bindViewTap" class="userinfo">
  <image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
  <text class="userinfo-name">{{userInfo.name}}</text>
  <text class="userinfo-desc">{{userInfo.desc}}</text>

 </view>
 <view class="usermotto">
  <text class="user-motto">{{motto}}</text>
 </view>
</view>

wxss:設置樣式

/**index.wxss**/
.userinfo {
 display: flex;
 flex-direction: column;
 align-items: center;
}

.userinfo-avatar {
 width: 128rpx;
 height: 128rpx;
 margin: 20rpx;
 border-radius: 50%;
}

.userinfo-name {
 color: #aaa;
 font-size: 30rpx;
 margin: 30rpx;
}

.userinfo-desc {
 color: #f00;
 font-size: 50rpx;
 line-height: 70rpx;
}

.usermotto {
 margin-top: 200px;
}

演示截圖

小程序組件Demo演示截圖

以上就是微信小程序的簡單實例,希望能幫助開始學習微信開發(fā)的朋友,謝謝大家對本站的支持!

相關文章

  • 到初創(chuàng)公司工作的五個理由

    到初創(chuàng)公司工作的五個理由

    這篇文章主要介紹了到初創(chuàng)公司工作的五個理由,在職業(yè)選擇上并不來一定要去大公司,去初創(chuàng)公司工作一次會讓你有更多的收獲,需要的朋友可以參考下
    2014-09-09
  • 使用postman操作ElasticSearch的方法

    使用postman操作ElasticSearch的方法

    這篇文章主要介紹了使用postman操作ElasticSearch的方法,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2021-03-03
  • OpenSSL生成v3證書方法及配置文件詳解

    OpenSSL生成v3證書方法及配置文件詳解

    本文主要介紹了OpenSSL生成v3證書方法及配置文件詳解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2022-07-07
  • 一步步教你安裝VSCode(附帶圖解步驟)

    一步步教你安裝VSCode(附帶圖解步驟)

    VScode全稱是微軟推出的一個跨平臺的編輯器,能夠在windows、Linux、IOS等平臺上運行,通過安裝一些插件可以讓這個編輯器變成一個編譯器,下面這篇文章主要給大家介紹了關于如何安裝VSCode的相關資料,需要的朋友可以參考下
    2023-01-01
  • 微信小程序(應用號)組件詳細介紹

    微信小程序(應用號)組件詳細介紹

    這篇文章主要介紹了微信小程序(應用號)組件詳細介紹的相關資料,需要的朋友可以參考下
    2016-09-09
  • Git常用命令介紹

    Git常用命令介紹

    Git是一個開源的分布式版本控制系統(tǒng),可以有效、高速地處理從很小到非常大的項目版本管理。這篇文章介紹了Git的常用命令,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2022-01-01
  • ChatGPT平替-?ChatGLM多用戶并行訪問部署過程

    ChatGPT平替-?ChatGLM多用戶并行訪問部署過程

    這篇文章主要介紹了ChatGPT平替-?ChatGLM多用戶并行訪問部署,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2023-05-05
  • C1任務01之修改游戲存檔的方法

    C1任務01之修改游戲存檔的方法

    這篇文章主要介紹了C1任務01之修改游戲存檔的相關知識,前三個任務會用到十六進制編輯器來實現(xiàn),在修改的的過程中涉及到的知識點為十進制數(shù)據(jù)與十六進制之間數(shù)據(jù)的相互轉換,需要的朋友可以參考下
    2021-10-10
  • 完美解決瀏覽器Flash插件過期不能用問題

    完美解決瀏覽器Flash插件過期不能用問題

    這篇文章主要介紹了完美解決瀏覽器Flash插件過期不能用問題
    2021-02-02
  • 軟件測試面試如何測試網(wǎng)頁的登錄頁面

    軟件測試面試如何測試網(wǎng)頁的登錄頁面

    本文主要介紹軟件測試面試如何測試網(wǎng)頁的登錄頁面,這里整理了相關軟件測試的一些基本知識,希望能幫助軟件測試的同學
    2016-08-08

最新評論