小程序初入门

1、到微信小程序注册用户并登记相关信息,会获得一个AppID,新建项目时填入,可以解锁更多功能。

当然不解锁一样可以开发。

2、新建好的小程序目录如下:

pages里面每个文件夹是一个页面,wxml类似于html,用来展示页面;

wxss类似于css,用来设定wxml里面各元素的样式;(wxss尺寸单位

js定义各种数据和wxml里面要用到的函数,和JavaScript还是有一点区别的。

json是页面的配置,用来存放JSON格式的字符串。

3、如何快捷新建页面?

(1)在pages下新建文件夹,文件夹内右键"新建"->"page",四个同名不同拓展名的文件就建好了,和文件夹名字还一样,不用修改,多好。

这样新建页面之后,需要在app.json的pages数组之中注册,不然编译通不过。

(2)直接在app.json的pages数组之中注册,然后编译报错,pages下自动补全相关文件

不过我这样做的时候有时候不好使,最好还是不要这么干。

4、app.js/json/wxss是什么?

app.wxss是全局的样式,可以通过组件的class属性来绑定,单个页面的样式与全局样式同名的话,全局样式会被重写,这个词应该挺形象的吧。。

app.json可以定义窗口样式、底部导航栏、小程序内页面注册,单个页面的json同名样式一样可以重写全局样式,比如可以通过修改"navigationBarTitleText"来设置不同页面的标题文字。

app.js是小程序的逻辑文件,必须要使用App()来初始化小程序,就像单个页面的js一样要有Page()来初始化页面。

app.js里面的是全局变量,页面js定义的是局部变量,页面js函数里面的就是局部的局部变量,大概就是这么个意思。

5、project.config.json是什么?

可以点击开发工具的详情查看,那里面的设置和project.config.json是一样的,一个配置文件,一个可视化的,目的是一样的。

参考资料:

微信小程序基本目录结构学习

wxss尺寸单位

[微信小程序之小白教程系列] 微信小程序 -- 入口

原文地址:https://www.cnblogs.com/BoqianLiu/p/9260540.html

时间: 2024-08-06 23:44:19

小程序初入门的相关文章

.NET教程:微信小程序基础入门

.NET教程:微信小程序基础入门 准备 Demo 项目地址 (https://github.com/zce/weapp-demo) Clone or Download(需准备GIT环境) $ cd path/to/project/root $ git clone https://github.com/zce/weapp-demo.git project-name --depth 1 $ cd project-name 没有git环境,可以直接下载 (https://github.com/zce/

从零开始:微信小程序新手入门宝典

为了方便大家了解并入门微信小程序,特将可能会需要的知识,列在这里,让大家方便的从零开始学习 一:微信小程序的特点 张小龙:张小龙全面阐述小程序,推荐通读此文: 小程序是一种不需要下载.安装即可使用的应用,它出现了触手可及的梦想,用户扫一扫或者搜一下即开打开应用,也出现了用完即走的理念,用户不用关心安装太多应用的问题,应用随处可用,但又无须安装卸载.我当时是这样来定义什么是小程序的. 1:无需下载:我们直接使用它,所以无须安装是小程序最基础的一个特性: 2:触手可及:当我们拿着智能手机接触周边的时

新手入门:微信小程序--从入门到精通宝典

<ignore_js_op> 作为新手入门的宝典,我们整理了本论坛各种有价值的内容,并按循序渐进的方式呈现给大家.大家可以按顺序一篇一篇的攻克本帖中的内容,也可以作为字典,跳转至关注的内容去学习.希望大家在这里能快速成长,成为微信小程序开发的顶尖高手. 本帖的内容结构如下:一:小程序之张小龙全面阐述及思维导图:二:微信小程序官方地址三:如何学习微信小程序四:新手入门系列教程集合五:公司开发前必读六:个人开发前必读 一:小程序之张小龙全面阐述及思维导图: 小程序之张小龙全面阐述:于1月9日上线(

利用WordPress REST API 开发微信小程序从入门到放弃

自从我发布并开源WordPress版微信小程序以来,很多WordPress网站的站长问有关程序开发的问题,其实在文章:<用微信小程序连接WordPress网站>讲述过一些基本的要点,不过仍然有不少人对一些细节不明白,于是我就想着再写一篇比较全面而基础的教程,主要针对入门级别用户,高手就不用看了. WordPress版“守望轩”微信小程序开放源码地址:https://github.com/iamxjb/winxin-app-watch-life.net 至于标题,请原谅我,我标题党了. Word

【尝新】微信小程序初体验

文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1474644089434 根据文档地址中下载微信开发工具后,按照文档指引可以创建一个快速体验的小demo ,样例中的文件说明如下: 小程序包含一个描述整体程序的 app 和多个描述各自页面的 page. 一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下: app.js 是 小程序逻辑 app.json 是 小程序公共设置 app.wxss 否 小程序公共样式表 一个小程序页面由四个文

微信小程序开发入门与实践

基础知识---- MINA 框架 为方便微信小程序开发,微信为小程序提供了 MINA 框架,这套框架集成了大量的原生组件以及 API.通过这套框架,我们可以方便快捷的完成相关的小程序开发工作. MINA 框架提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 JavaScript 的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,因此我们主要聚焦于数据与逻辑上. 响应的数据绑定 框架的核心是一个响应的数据绑定系统. 整个系统分为两块:视图层(View)和逻辑层(App Ser

微信小程序开发入门学习(1):石头剪刀布小游戏

从今天起开始捣鼓小程序了2018-12-17   10:02:15 跟着教程做了第一个入门实例有兴趣的朋友可以看看: 猜拳游戏布局 程序达到的效果 猜拳游戏的布局是纵向显示了三个组件:文本组件(text).图像组件(image)和按钮组件(button).在创建小程序工程时,默认建立了两个页面:index 和 logs.我们不需要管 logs,在这个例子中只修改和 index 页面相关的文件,index 是小程序第一个显示的页面,其中 index.wxml 文件是 index 页面的布局文件.

微信小程序基础入门

准备 Demo 项目地址 https://github.com/zce/weapp-demo Clone or Download(需准备GIT环境) $ cd path/to/project/root $ git clone https://github.com/zce/weapp-demo.git project-name --depth 1 $ cd project-name 没有git环境,可以直接下载 安装开发环境 下载地址 Windows 64位 Windows 32位 macOS 安

微信小程序初体验遇到的坑

今天,2017年1月9日凌晨,微信小程序如约上线.2007年1月9日,整整10年前的今天,苹果的iPhone手机正式问世! 经不起新技术的诱惑了,想试着开发一下看看.刚开始遇到很多坑,在这里记录一下,有遇到同样坑的可以参考 1.我用的是mac版本的开发工具,运行官方demo后报错 Failed to load resource: net::ERR_NAME_NOT_RESOLVEDhttp://1351598279.appservice.open.weixin.qq.com/appservice