1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        (白嫖)新手練習(xí)小程序入門項(xiàng)目,建立屬于自己的一個(gè)微信小程序!

        共 2672字,需瀏覽 6分鐘

         ·

        2021-05-28 15:36

        ?詳細(xì)介紹一個(gè)微信小程序項(xiàng)目——剪刀石頭布游戲,此項(xiàng)目較為簡(jiǎn)單,但麻雀雖小五臟俱全,包含小程序的所有要求,只有將最基礎(chǔ)的學(xué)習(xí)好,才能有所成就。

        在此說(shuō)明:微信小程序包含微信小游戲,微信小游戲不包含微信小程序。

        主要語(yǔ)言:JavaScript==xx.js、html==wxml、css==wxss、node

        工具:微信開(kāi)發(fā)者工具


        01



        視頻展示

        具體指引詳見(jiàn)《https://live.csdn.net/v/165058》



        02


        介紹與趨勢(shì)

        微信小程序(wei xin xiao cheng xu),簡(jiǎn)稱小程序,縮寫(xiě)XCX,英文名Mini Program,是一種不需要安裝即可使用的應(yīng)用,它實(shí)現(xiàn)了應(yīng)用“觸手可及”的夢(mèng)想,用戶掃一掃或搜一下即可打開(kāi)應(yīng)用。全面開(kāi)放申請(qǐng)后,主體類型為企業(yè)、政府、媒體、其他組織或個(gè)人的開(kāi)發(fā)者,均可申請(qǐng)注冊(cè)小程序。小程序、訂閱號(hào)、服務(wù)號(hào)、企業(yè)號(hào)是并行的體系。從微信小程序近期開(kāi)放的功能明顯看出,小程序的發(fā)展前景十分看好,并且隨著時(shí)間的流逝,相信將會(huì)開(kāi)放更多功能,實(shí)現(xiàn)更多的需求。

        76644d512c02ec5c91848e8c62e3084e.webp


        未來(lái)小程序和微信將實(shí)現(xiàn)更佳的鏈接,用戶搜索小程序更加方便,這就是小程序的未來(lái)發(fā)展方向及優(yōu)勢(shì)。

        02


        代碼展示

        部分代碼展示:

        (1)項(xiàng)目準(zhǔn)備

        35218b128267a40b53caa569b71f5e2e.webp

        (2)編碼實(shí)現(xiàn)

        ba6971686667512e9f2c7f772c7e7ea4.webp


        index.js代碼如下:

        //index.js//獲取應(yīng)用實(shí)例var app = getApp()var imagePaths = ['../../images/scissors.png', '../../images/stone.png', '../../images/cloth.png'];var imageIndex = 0;


        Page({ data: { imagePath: imagePaths[0], title: '開(kāi)始', isRunning:false, userInfo: {},

        }, //事件處理函數(shù) bindViewTap: function () { wx.navigateTo({ url: '../logs/logs' }) }, change: function (e) { imageIndex++; if (imageIndex > 2) { imageIndex = 0; }
        this.setData( { imagePath: imagePaths[imageIndex] } ) }, guess: function (e) { let isRunning = this.data.isRunning; if (!isRunning) { this.setData( { title: '停止', isRunning:true } );
        this.timer = setInterval((function () { this.change() }).bind(this), 100); } else { this.setData( { title: '開(kāi)始', isRunning:false } );
        this.timer && clearInterval(this.timer); }
        }, onLoad: function () { console.log('onLoad') console.log('onLoad11') var that = this
        //調(diào)用應(yīng)用實(shí)例的方法獲取全局?jǐn)?shù)據(jù) app.getUserInfo(function (userInfo) { //更新數(shù)據(jù) that.setData({ userInfo: userInfo }) }) }})

        091b955d54b1593c7b718a1bf3517297.webp

        index.wxml代碼如下:

        <!--index.wxml--><view class="container">    <text class="finger_guessing">猜拳游戲</text>    <view   class="userinfo">    <image class="userinfo-avatar" src="{{imagePath}}" background-size="cover"/>        <button bindtap="guess">{{title}}</button>  </view></view>

        index.wxss代碼如下:

        /**index.wxss**/.userinfo {  display: flex;  flex-direction: column;  align-items:center;  margin-top: 50px;}
        .userinfo-avatar { width: 500rpx; height: 500rpx; margin: 40rpx;

        }
        .userinfo-nickname { color: #aaa;}
        .finger_guessing { color: #F00; font-size: 30px; margin-top: 20px;}

        由于代碼量太大,所以就不一一展示了。

        具體指引詳見(jiàn)

        《https://download.csdn.net/download/qinluyu111/18448520》


        寫(xiě)在最后


        以上就是今天要講的內(nèi)容,本文僅僅簡(jiǎn)單介紹了一個(gè)基礎(chǔ)的微信小程序案例,而微信開(kāi)發(fā)文檔提供了大量能使我們快速便捷地學(xué)習(xí)實(shí)現(xiàn)微信小程序的插件和方法。希望通過(guò)此次學(xué)習(xí),你能擁有屬于自己的微信小程序,并不斷前進(jìn),一步一步成為大佬。如果此篇文章確實(shí)對(duì)你有所幫助,請(qǐng)點(diǎn)一個(gè)贊,謝謝您的評(píng)價(jià)。此文章若有雷同,請(qǐng)聯(lián)系本人,謝謝。最后再奉上源碼,公眾號(hào)回復(fù)?051?即可獲取下載地址關(guān)注我,不迷路


        瀏覽 108
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        評(píng)論
        圖片
        表情
        推薦
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            亚洲无码色 | 久热热热热 | 19p内射 | 国产精品久久欠久久久久久九秃 | 乱人做爰AV在线观看 | beeg日本xxxx18hd | 成人免费视频 国产在线观看 | 一边舌吻一边揉我的胸 | 无码人妻一级毛片免费60岁 | 天天综合网在线 |