请选择 进入手机版 | 继续访问电脑版

数字之家

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

搜索
热搜: 活动 交友 discuz
查看: 117|回复: 0

微信小程序开发(二)软件安装并进行初步调试

[复制链接]
  • TA的每日心情
    开心
    2019-5-7 14:15
  • 签到天数: 9 天

    [LV.3]偶尔看看II

    396

    主题

    399

    帖子

    1860

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    积分
    1860
    admin实名认证 发表于 2019-5-11 17:15:30 | 显示全部楼层 |阅读模式
    在上一篇的文章中,我想大家应该看到了那个首页头图,在讲解如何实现首页前我们先把准备工作先做好。
    ddsd.jpg
    “工欲善其事,必先利其器”。首先,我们要在电脑上下载微信开发者工具,如图:
    ddssd.jpg
    电脑上没有的话,度娘一下就OK了。
    下载完毕后,我们打开这个东东,一开始会让你微信扫一扫,扫完之后会出现下图的界面:

    ddsddd.jpg
    因为我们做的是小程序,所以我们点击左侧的小程序项目,点击完会出现下图所示的界面:
    3211.jpg
    项目目录就是你的小程序选择放在哪里,这里我放在了桌面,大家根据自己的喜好自行放置,AppID先不用注册,点击APPID输入框下面的测试号有个蓝色字体的小程序,点击后APPID就会出现了,这里不注册是我给大家做演示用,大家先用测试号开发,开发完后再注册一个APPID,到时候直接把代码扔过去就行了。项目名称就是你在项目目录的地方新建一个文件夹,我的项目目录在桌面上,所以我在桌面上新建一个文件夹aa,上述东整完后,点击确定按钮,会进入下图的界面:
    32141.jpg
    该界面的左侧是调试器,右侧是代码编写区,大家在右侧写完代码后,可以在左侧看到效果。看到这里是不是有点心动了呢,别急,慢慢来。

    右侧有个pages目录,我们的代码就是要在这个里面写,下面让我们在pages目录里面新建一个目录叫做welcome的目录,然后在welcome目录里面新建welcome.wxml、welcome.js、welcome.wxss这三个文件。具体做法就是右键单击pages目录,新建目录,然后目录名定义为welcome,welcome目录建成后,右键单击welcome目录,新建wxml、wxss、js文件并都命名为welcome。新建完后pages目录如图所示:

    222111.jpg
    然后我们打开welcome.wxml文件,在里面输入一个hello world!然后保存,看看会出现什么。

    很明显,大家期望中的hello world!并没有出现,而是出现这一个界面:

    6514.jpg
    这个界面中的Hello World 可不是我们写的”hello world!“,为什么我们输入了hello world!后却没有出现呢?大家在目录中自行找到app.json的文件并打开,打开后如图所示:
    999.jpg
    可以看到,app.json是一个数组,由pages和window组成,大家找到pages,里面第一个是“pages/index/index”,大家在pages目录里面自行查找,找到后打开index.wxml,看看里面的代码,
    5558.jpg

    大家先不用管代码看不看得懂,是不是看到了”获取头像昵称“这几个字,在看看你左侧调试器中的界面是不是也有这几个字,看到这里你是不是明白了点什么,我们尝试着把我们自己创建的目录页写到app.json的pages里面,

    大家在app.json的pages数组里面输入"pages/welcome/welcome",并把它放在“pages/index/index”上面,如图:

    然后大家保存一下,进行调试,效果图如下:

    111.jpg
    这样是不是就可以了呢,大家是不是可以想到,我想显示那个页面,我就在app.json的pages数组里面把我想显示页面的路径放在第一个就ok了,确实是这样。

    其他的目录或者文件我没有提到是因为现在还没有用到,等用到的时候我会介绍给大家,大家好好消化消化,把这个流程在过一遍,把这些东西弄懂之后,下篇文章就开始我们的实战之旅了,准备好了吗?

    希望大家能够点一下那个关注,这样我一发文章,大家就能在第一时间看到,也希望大家能够踊跃评论,点赞和转发~~~

    大家有兴趣可以加一下下面的这个群,在群里面我会解决大家开发时遇到的问题。


    本文采集百度百家号:web开发那些事 原文链接https://mbd.baidu.com/newspage/d ... A%22bjhauthor%22%7D
    maomivip@mail.com
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    QQ|Archiver|手机版|小黑屋|寿光赢创志诚信息技术有限公司 ( 鲁ICP备19000917号 )

    GMT+8, 2019-5-22 23:36 , Processed in 0.062174 second(s), 24 queries .

    Powered by Discuz! X3.4

    © 2001-2017 Comsenz Inc.

    快速回复 返回顶部 返回列表