微信小程序开发项目实战（微课版） 课后实训试题及答案汇总 黄龙泉 项目实训01--10.docx

PAGE3

项目1虚拟商业环境综合实训平台简介

PAGE4

微信小程序开发项目实战（微课版）

项目实训

一、选择题

1．下面关于WXML的哪一个说法是错误的？（D）

A．WXML是指WeiXinMarkupLanguage，用于构建页面的结构

B．具有数据绑定、列表渲染的能力

C．可以进行if/else等简单的条件渲染

D．目前还不支持进行事件绑定

2．小程序是通过哪一种方式实现动态改变样式的？（B）

A．提供修改样式的API

B．使用WXML语言提供的数据绑定功能

C．直接操作DOM

D．没有任何方式

3．微信小程序的页面逻辑部分主要使用哪一种语言开发？（B）

A．Java B．Javascript C．C++ D．C#

二、综合实训

微信小程序提取公用函数到util.js及使用方法示例。

步骤1：在util.js定义获得图片路径函数。代码如下：

//定义图片路径

varURl=/images/;

//定义获取图片函数

vargetImageurl=imageurl={

returnURl+imageurl;

}

//输出函数

module.exports={

URl:URl,

getImageurl:getImageurl

}

图1-38util.js文件定义函数

步骤2：在index.js调用的util.js文件获取图片路径的函数。

//模块化引用utils里面的js地址

varutils=require(../../utils/util.js)

//console.log(utils)可查看获得的函数

console.log(utils.getImageurl(banner-01.png))

图1-39引用util.js里的函数

PAGE49

项目2小程序编程基础

项目实训

一、选择题

1．下面程序，index.wxml页面显示的信息是（C）。

index.wxml页面代码如下：

viewwx:if={{length5}}1/view

viewwx:elif={{length2}}2/view

viewwx:else3/view

index.js页面代码如下：

Page{()

data:{length:6}

)}

A．3 B．2 C．1 D．不显示

2．下面结果，index.wxml页面显示的信息是（C）。

index.wxml页面代码如下：

blockwx:if={{true}}

viewview1/view

viewview2/view

/block

A．view1 B．view2 C．view1view2 D．无

3．App的生命周期函数不包括（C）。

A．onHide B．onError C．onLoad D．onLaunch

4．Page的生命周期函数不包括（D）。

A．onReady B．onUnload C．onShow D．onLaunch

5．下面程序，正确答案的是（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

二、综合实训

1．组件绑定事件，通过点击事件，使组件颜色和大小发生改变，并输出随机数。

步骤1：新建小程序页面，在WXML页面实现页面布局。

viewclass=box

style=background:{{color}};width:{{size}}rpx;height:{{size}}rpx;bindtap=clickBox

随机数是：{{num}}

/view

步骤2：在WXSS页面实现页面样式的设置。

.box{

margin:50rpx;

width:200rpx;

height:200rpx;

background:pink;

color:black;

display:flex;

justify-content:center;

align-items:center;

}

步骤3：在JS页面实现事件绑定clickBox代码的编写。

Page({

data:{

num:0,

color:pink,

size:300

},

clickBox(){

letrandomdata=parseInt(Math.ra