页面目录如下:
我们想在Hello Wrold下面显示
性别:男
名称:璐菲
QQ:1104775852
最直接的是在index.wxml中放三个view组件
<view>性别:男</view>
<view>名称:璐菲</view>
<view>QQ:1104775852</view>
如果使用数据绑定,在index.wxml中使用index.js中的数据,则使用{{}}两个花括号来访问,
此外微信小程序中还支持wx : if = "{{name}}"这样的判断,如果name不为空则显示QQ
<view>性别: {{sex}}</view>
<view>名称: {{name}}</view>
<view wx:if="{{name}}">QQ: {{QQ}}</view>
index.js中用来存放数据的代码
page
({
data:"Hello World",
name:"璐菲",
sex:"男",
QQ:"1104775852",
})
如果在index.wxml中使用index.wxss中的样式则可以通过选择器(图片来自微信小程序开发文档)
使用@import关键字来导入wxss文档。
@import "test.wxss";
在index.wxml中使用js中的事件
js中的代码
page
({
output: function()
{
console.log("这是我的QQ");
},
})
wxml中的代码
<view bindtap="output">QQ:111111111</view>