微信小程序開發(fā)項目實戰(zhàn)（微課版） 課后實訓(xùn)試題及答案匯 黃龍泉 項目實訓(xùn)01-10

PAGE3項目1虛擬商業(yè)環(huán)境綜合實訓(xùn)平臺簡介PAGE4微信小程序開發(fā)項目實戰(zhàn)（微課版）項目實訓(xùn)一、選擇題1．下面關(guān)于WXML的哪一個說法是錯誤的？（D）A．WXML是指WeiXinMarkupLanguage，用于構(gòu)建頁面的結(jié)構(gòu)B．具有數(shù)據(jù)綁定、列表渲染的能力C．可以進行if/else等簡單的條件渲染D．目前還不支持進行事件綁定2．小程序是通過哪一種方式實現(xiàn)動態(tài)改變樣式的？（B）A．提供修改樣式的APIB．使用WXML語言提供的數(shù)據(jù)綁定功能C．直接操作DOMD．沒有任何方式3．微信小程序的頁面邏輯部分主要使用哪一種語言開發(fā)？（B）A．Java B．Javascript C．C++ D．C#二、綜合實訓(xùn)微信小程序提取公用函數(shù)到util.js及使用方法示例。步驟1：在util.js定義獲得圖片路徑函數(shù)。代碼如下：//定義圖片路徑varURl='/images/';//定義獲取圖片函數(shù)vargetImageurl=imageurl=>{returnURl+imageurl;}//輸出函數(shù)module.exports={URl:URl,getImageurl:getImageurl}圖1-38util.js文件定義函數(shù)步驟2：在index.js調(diào)用的util.js文件獲取圖片路徑的函數(shù)。//模塊化引用utils里面的js地址varutils=require('../../utils/util.js')//console.log(utils)可查看獲得的函數(shù)console.log(utils.getImageurl('banner-01.png'))圖1-39引用util.js里的函數(shù)PAGE49項目2小程序編程基礎(chǔ)項目實訓(xùn)一、選擇題1．下面程序，index.wxml頁面顯示的信息是（C）。index.wxml頁面代碼如下：<viewwx:if="{{length>5}}">1</view><viewwx:elif="{{length>2}}">2</view><viewwx:else>3</view>index.js頁面代碼如下：Page{()data:{length:6})}A．3 B．2 C．1 D．不顯示2．下面結(jié)果，index.wxml頁面顯示的信息是（C）。index.wxml頁面代碼如下：<blockwx:if="{{true}}"><view>view1</view><view>view2</view></block>A．view1 B．view2 C．view1view2 D．無3．App的生命周期函數(shù)不包括（C）。A．onHide B．onError C．onLoad D．onLaunch4．Page的生命周期函數(shù)不包括（D）。A．onReady B．onUnload C．onShow D．onLaunch5．下面程序，正確答案的是（D）。<blockwx:for="{{[1,2,3]}}"><view>{{index}}:{{item}}</view></block>A．0：3 B．0：0 C．1：1 D．0：1 1：2 1：1 2：2 1：2 2：1 2：2 3：3 2：3二、綜合實訓(xùn)1．組件綁定事件，通過點擊事件，使組件顏色和大小發(fā)生改變，并輸出隨機數(shù)。步驟1：新建小程序頁面，在WXML頁面實現(xiàn)頁面布局。<viewclass="box"style="background:{{color}};width:{{size}}rpx;height:{{size}}rpx;"bindtap="clickBox">隨機數(shù)是：{{num}}</view>步驟2：在WXSS頁面實現(xiàn)頁面樣式的設(shè)置。.box{margin:50rpx;width:200rpx;height:200rpx;background:pink;color:black;display:flex;justify-content:center;align-items:center;}步驟3：在JS頁面實現(xiàn)事件綁定clickBox代碼的編寫。Page({data:{num:0,color:"pink",size:300},clickBox(){letrandomdata=parseInt(Math.random()*100)letr1=parseInt(Math.random()*255)letr2=parseInt(Math.random()*255)letr3=parseInt(Math.random()*255)letcolor=`rgb(${r1},${r2},${r3})`letsize=parseInt(Math.random()*400)size=size<200?200:sizethis.setData({num:randomdata,color:color,size:size})},})2．實現(xiàn)以下效果，并在控制臺上打印表單提交的信息，效果如圖2-23、2-23所示。圖2-23表單效果圖2-24控制臺結(jié)果PAGE127項目5新聞頁面模塊開發(fā)項目實訓(xùn)一、選擇題1．（單選題）微信小程序特有的尺寸單位是？（A）A．rpx B．cm C．px D．pt2．（單選題）以下哪個不屬于小程序的容器組件？(A)A．<cover-view> B．<text> C．<scroll-view> D．<view>3．<icon>是圖標組件，以下哪句代碼可以實現(xiàn)一個紅色、40像素大小的搜索圖標？(B)A．<icontype="discover"size="40rpx"color="red"></icon>B．<icontype="search"size="40"color="red"></icon>C．<icontype="search"size="40rpx"color="red"></icon>D．<icontype="discover"size="40"color="red"></icon>4．以下哪個不屬于媒體組件？(C)A．<audio> B．<canvas> C．<video> D．<image>5．以下哪個不屬于表單組件?(B)A．<input> B．<icon> C．<form> D．<button>6．以下哪個組件可以用于播放視頻？(B)A．View B．video C．a(chǎn)udio D．image二、綜合實訓(xùn)（1）在utils/util文件中定義一個隨機函數(shù)，在index.js中引入該文件，并使用隨機函數(shù)獲得圖片。（2）定義一個函數(shù)分頁函數(shù)，每10條數(shù)據(jù)作為一頁，當上拉觸底時調(diào)用分頁函數(shù)實現(xiàn)分頁數(shù)據(jù)的顯示。項目實訓(xùn)一、選擇題1．flex-basis的作用是？（D）A．分配多余空間之前，項目占據(jù)的主軸空間B．分配剩余空間給該元素C．該元素變?yōu)閺椥詫挾菵．以上都對2．設(shè)置彈性子元素各行之間對齊的屬性是？（C）A．flex-wrap B．space-between C．a(chǎn)lign-content D．a(chǎn)lign-items3．設(shè)置彈性子元素在主軸對齊方式的屬性是？（B）A．flex-wrap B．space-between C．a(chǎn)lign-content D．a(chǎn)lign-items二、綜合實訓(xùn)1．使用swiper組件實現(xiàn)頂部導(dǎo)航，使得內(nèi)容頁具有滑動功能，效果如圖4-19所示。圖4-19運行效果項目實訓(xùn)一、選擇題1．首次調(diào)用wx.navigateTo從PageA頁面跳轉(zhuǎn)到PageB頁面，下面哪一個生命周期函數(shù)不會被調(diào)用？（A）A．onUnload() B．onHide() C．onLoad() D．onShow()2．（多選）下列哪些屬性參數(shù)傳值的方法（ABCD）。A．給布局元素添加data-*屬性來傳遞我們需要的值B．通過e.currentTarget.id獲取設(shè)置的id的值C．通過設(shè)置全局對象的方式來傳遞數(shù)值D．在navigator中添加參數(shù)傳值3．關(guān)于小程序的路由說法錯誤的是（A）。A．B．wx.redirectTo()：關(guān)閉當前頁面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個頁面。但是不允許跳轉(zhuǎn)到tabbar頁面C．wx.switchTab()：跳轉(zhuǎn)到abBar頁面，并關(guān)閉其他所有非tabBar頁面D．wx.reLaunch()：關(guān)閉所有頁面，打開到應(yīng)用內(nèi)的某個頁面4．this.data賦值語句和this.setData({})賦值方式的區(qū)別是（A）。A．tB．C．D．this.data賦值語句只改變變量的值，this.setData({})既不改變變量的值又不會更新視圖二、綜合實訓(xùn)完成下面的新聞列表頁和內(nèi)容表，效果如圖所示。 圖5-21新聞列表頁效果 圖5-22新聞詳情頁效果項目實訓(xùn)一、選擇題1．（多選）小程序是通過哪一種方式實現(xiàn)動態(tài)改變樣式的？（AB）A．提供修改樣式的API B．C．直接操作DOM D．沒有任何方式2．下列不屬于scroll-view組件屬性的是（D）。A．scroll-x B．bindscroll C．scroll-top D．current3．（多選）小程序頁面間有哪些傳遞數(shù)據(jù)的方法？（ABCD）A．使用全局變量實現(xiàn)數(shù)據(jù)傳遞B．頁面跳轉(zhuǎn)或重定向時，使用url帶參數(shù)傳遞數(shù)據(jù)C．使用緩存?zhèn)鬟f參數(shù)D．使用數(shù)據(jù)庫傳遞數(shù)據(jù)4．如何封裝微信小程序的數(shù)據(jù)請求？以下說法錯誤的是（D）。A．將所有的接口放在統(tǒng)一的js文件中并導(dǎo)出B．在app.js中創(chuàng)建封裝請求數(shù)據(jù)的方法C．在子頁面中調(diào)用封裝的方法請求數(shù)據(jù)D．webview用來處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用。二、綜合實訓(xùn)題請讀者參考項目6實現(xiàn)商品分類頁的過程。 圖6-14產(chǎn)品分類頁效果 圖6-15分類切換效PAGE169項目7購物車模塊開發(fā)項目實訓(xùn)一、選擇題1．下列代碼運行結(jié)果是（B）。letnum=[1,2,3,4,5];leteve=num.every(function(item,index,arr){return(item>2);});console.log(eve);A．true B．false C．3 D．null2．下列代碼運行結(jié)果是（A）。letnum=[1,2,3,4,5];letsum=0num.forEach(function(item,index,arr){sum+=arr[index]})console.log(sum)A．15 B．12 C．6 D．103．下列代碼運行結(jié)果是（A）letarr=[1,2,3]arr.forEach(function(item,index,array){console.log(array)})A．[1,2,3] B．[0,1,2] C．[3] D．[1]二、綜合實訓(xùn)題 圖7-10購物車頁面效果 圖7-11訂單頁面效果PAGE211項目實訓(xùn)一、選擇題1．下列關(guān)于用戶信息屬性描述錯誤的是（D）。A．a(chǎn)vatarUrl表示用戶頭像的URL地址B．nickName：用戶昵稱C．province：用戶所在省份D．gender：用戶的性別，0表示男，1表示女2．下列關(guān)于wx.getUserInfo()接口返回值說法錯誤的是（C）。A．errMsg表示錯誤信息B．rawData：用于計算簽名C．iv：加密算法的初始向量D．userInfo：用戶信息對象，包含openid等信息3．小程序模塊開發(fā)中，通過（D）語法對外暴露接口。A．export B．import C．require D．moudle.exports4．小程序中模板的使用，通過<template>的（B）屬性導(dǎo)入模板所需要的數(shù)據(jù)。A．value B．data C．data-item D．item5．小程序模塊化開發(fā)中，（D）組件來定義模板。A．<view> B．<model> C．<component> D．<template>6．小程序中模板的使用，通過<template>的（D）屬性來定義模板。A．is B．isname C．type D．name7．echarts是什么技術(shù)？（D）A．商業(yè)聊天軟件 B．商業(yè)圖片編輯軟件C．商業(yè)辦公軟件 D．商業(yè)產(chǎn)品圖表庫二、綜合實踐題1．使用模板功能，完成以下效果，如圖所示。圖8-17模板功能2．使用echart功能，完成以下效果，如圖8-18、8-19所示。項目實訓(xùn)一、選擇題1．要使用node.js的http模塊創(chuàng)建一個httpserver，需要調(diào)用哪些方法。（B）A．http.createClient B．http.createServerC．http.Server.listen D．http.get2．路由參數(shù)獲取幾種方式？（C）A．1 B．2 C．3 D．43.路由指什么（B）A接口B根據(jù)url的變更重新渲染頁面布局和內(nèi)容的過程。C返回的數(shù)據(jù)D以上都不對4．package.json文件中有一個什么字段，可以用于指定腳本命令。（A）A．scripts B．devDependenciesC．script D．name5．npminit__加那個參數(shù)可以生成package.json文件。（A）A．參數(shù)-y B．參數(shù)-v C．參數(shù)-i D．參數(shù)-a二、綜合實踐題1．使用小程序訪問以下GET數(shù)據(jù)接口。app.get('/get',function(req,res){res.setHeader('Content-Type','text/plain;charset=utf8');res.end(JSON.stringify({code:0,data:{brandName:'品牌名稱',couponAvailableTime:'2020-45-34',},msg:'success',success:true}))})2．使用小程序訪問以下POST數(shù)據(jù)接口。app.post('/post',function(req,res){res.setHeader('Content-Type','text/plain;charset=utf8');res.end(JSON.stringify({code:0,data:{list:[{couponTemplateId:1,couponName:'小布丁代金券',}],pageIndex:1,pageSize:10,total:3},msg:'success',success:true}))})項目實訓(xùn)一、填空題1．在Node.js代碼中要加載mysql模塊，怎么做?（B）A．http模式是全局的，無需加載，直接使用即可B．使用require('mysql')即可C．使用module方法D．使用exports方法2．npmset用來設(shè)置什么?（C）A．默認值 B．變量 C．環(huán)境變量 D．默認環(huán)境3．mysql是一種什么類型的數(shù)據(jù)庫?（A）A．關(guān)系型數(shù)據(jù)庫 B．非關(guān)系型數(shù)據(jù)庫C．資源管理器 D．一種python的數(shù)據(jù)類型4．module.exports和exports的區(qū)別是?（C）A．一個是對象下的值一個是方法B．沒有區(qū)別C．module.export