微信小程序入门(二)

摘要:
hellorworld.js作用:是帮助我们去注册一个微信小程序的页面先写空Page({})helloworld.json作用:页面的一些配置信息先写空{}helloworld.wxss作用:用来描述小程序的一个样式,类似cssview{100%;height:40rpx;text-align:center;color:blue;}目录结构和运行效果

5.安装微信开发者工具

小程序入口文档

点“小程序开发”-->>"工具-->>再点左边的“下载”,进行开发者工具的下载

微信小程序入门(二)第1张

6.小程序代码结构简介

登陆开发者工具,创建小程序项目

微信小程序入门(二)第2张

目录结构

微信小程序入门(二)第3张

7.小程序配置文件介绍

全局配置app

  • Pages
  • tabBar
  • networkTimeout
  • debug
  • navigationStyle

单个页面配置page

  • navigationBarBackgroundColor
  • navigationBarTextStyle
  • navigationBarTitleText
  • onReachBottonDistance
  • enablePullDownRefresh
  • disableScroll

8,9.开发者工具详解

创建一个'helloworld'的小程序,不使用模板

微信小程序入门(二)第4张

开发者工具界面

微信小程序入门(二)第5张

小程序版本

  • 预览版本
  • 体验版本
  • 开发版本
  • 审核版本
  • 线上版本

10.创建第一个小程序

创建几个文件

app.js

作用:帮我们注册一个微信小程序的应用
先写成空

App({})

app.json

作用:是对我们微信小程序应用的一个全局配置
pages里面是目录

{  "pages":[    "pages/helloworld/helloworld"  ]}

helloworld.wxml

作用:wxml文件就是描述我们页面上要有哪些内容,类似HTML

<view>Hello World!</view>

hellorworld.js

作用:是帮助我们去注册一个微信小程序的页面
先写空

Page({})

helloworld.json

作用:页面的一些配置信息
先写空

{}

helloworld.wxss

作用:用来描述小程序的一个样式,类似css

view{   100%;  height: 40rpx;  text-align: center;  color: blue;}

目录结构和运行效果

微信小程序入门(二)第6张

免责声明:文章转载自《微信小程序入门(二)》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇C# DataTable.Select() 筛选数据vuecli入门项目实战下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

微信小程序通信录

第一步:phone.wxml中 <view bindlongtap="clickPhone">{{phoneNum}}</view> 第二步:phone.json { "navigationBarTitleText": "联系人" } 第三步:phone.wxss view{ color:blue; padding: 1...

微信小程序实现滚动到指定位置

<view bindtap="toComment">查看回答</view> //...其他内容 <view id="comment">回答</view> toComment() { var query = wx.createSelectorQuery()//创建节点查询器 qu...

微信小程序之发送模板消息(通过openid推送消息给用户)

一、获取access_tokenaccess_token是接口调用的凭证,目前有效期为两个小时,需要定时刷新,重复获取将导致上次获取的access_token失效。(注:不建议每次调用需要access_token的接口,都去重新获取access_token,会导致失败)获取access_token的接口地址: https://api.weixin.qq.c...

微信小程序知识点总结--组件

一、部分常用组件 1、scroll-view可滚动视图区域:   <scroll-view>标签必须设置scroll-x/scroll-y属性,否则不能实现滚动效果 css设置:<scroll-view>标签可以设置white-space:nowrap,子元素设置display:inline-block(如子元素中有文字需要换行,则...

微信小程序---生命周期函数【详解】

在小程序的开发过程中,小程序的生命周期是非常重要的,特别是这7个小程序生命周期函数。 小程序的7个生命周期函数: 1、onLoad 监听页面加载 onLoad函数:一个页面只会被调用一次,可以在onLoad中获取当前页面所调用的 query 参数。 示例:onLoad:function(options){} 2、onReady 监听页面初次渲染完成 onR...

微信小程序访问webservice(wsdl)+ axis2发布服务端(Java)

0、主要思路:使用axis2发布webservice服务端,微信小程序作为客户端访问。步骤如下: 1、服务端: 首先微信小程序仅支持访问https的url,且必须是已备案域名。因此前期的服务器端工作需要先做好,本人是申请了个人域名(已备案),并使用阿里云服务器,然后申请免费SSL,通过配置tomcat完成支持https访问。此外,intellJ IDE的j...