微信小程序7---新页面的创建和页面代码组成结构

最新推荐文章于 2024-02-19 12:51:09 发布
最新推荐文章于 2024-02-19 12:51:09 发布
阅读量434 收藏
点赞数
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43846020/article/details/105761000
版权

在这里插入图片描述
在这里插入图片描述

方式1

在这里插入图片描述
编译后会自动出现about:
在这里插入图片描述

方式2

手动点击pages文件夹，右击点击新建目录，命名为news，再在news文件夹右键新建page再回车则自动创建了
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

删除

比如要把about页面删除
必须人为的在app.json把代码/about/about删掉
还要删除about文件夹（右键点击删除）

放在第一行编译：
在这里插入图片描述

在一个文件夹创建多个页面

在这里插入图片描述
在这里插入图片描述

组成页面结构的不同文件

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

Asteroid 325
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[微信小程序专题] 基本页面设置
算法与编程之美
02-01 3771
欢迎点击「算法与编程之美」↑关注我们！本文首发于微信公众号："算法与编程之美"，欢迎关注，及时了解更多此系列文章。问题描述1 最近几年微信小程序特别的火，快捷容易不需要下...
微信小程序代码-我厨 tab 界面设计.zip
04-22
微信小程序代码-我厨 tab 界面设计.zip，小程序模板代码，可以直接从源码里粘贴复制过来，虽然这样做不利于自己独立编写代码。
微信小程序文章详情页面实现代码
12-02
先自己绘制了一个丑陋的原型图，然后开始在小程序上绘制页面，然后设计样式，一路过来总结就是哪里不懂查哪里之旅~ 原型设计和分析 原型图效果 文章详情.png 为什么要这么设计？ 正常情况下是设计先出设计图，然后服务器和我们一同讨论接口如何设计，然后根据服务器返回的结果，我们再去界面上显示。但是这里我们使用的是第三方的接口，所以只能他有什么我们显示什么了。 服务器接口返回的数据如下如： 小程序-服务器返回结果.png 分析 json 结果，我们这里为了简单，也就只显示几个元素分别是 时间,标题，类型，作者，图片 。 整体是垂直排列，然后图片是根据是否有返回来动态显示，最后的心形图标是为了收藏使
小程序开发之页面组成
NINO_JAM的博客
04-20 454
小程序开发之页面组成
微信小程序页面结构与全局配置
ldjgood的博客
07-20 794
目录微信小程序的结构项目的文件结构小程序的页面组成微信小程序的全局配置小程序的窗口表现新建小程序页面tabBar标签栏 微信小程序的结构 项目的文件结构     微信小程序的根目录下通常包含 app.js、app.json、app.wxss 这三个必不可少的主体文件，project.config.json项目配置文件，sitemap.json微信索引文件，以及pages文件夹。 app.json：小程序的公共设置，可以对小程序进行全局配置，决定页面文件的路径（pag
微信小程序页面结构以及如何新建一个页面
刘璐菲
06-23 1178
现在在整体配置中sitemap.json文件也不可以省略 新建页面所需要的代码 app.js中 App({ /** * 当小程序初始化完成时，会触发 onLaunch（全局只触发一次） */ onLaunch: function () { }, /** * 当小程序启动，或从后台进入前台显示，会触发 onShow */ onShow: function (options) { }, /** * 当小程序从前台进入后台，会触.
微信小程序框架的页面布局代码
10-16
主要介绍了微信小程序框架的页面布局代码，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
微信小程序基本结构
qq_56892136的博客
06-14 326
Pages：用于存放所有小程序界面，每个页面都是一个单独文件夹 utils：用于存放工具性质模块 app.js:整个小程序项目的入口文件 app.json：全局配置文件 app.wxss：全局样式文件 project.config.json：项目的配置文件 不常用 sitemap.json：配置页面被微信搜索到的一些设置 不常用在app.json中修改pages属性，增加新的页面保存后pages文件夹就会生成这个文件在app.json配置tabBar 效果...
第一篇：先简单了解一下微信小程序页面结构，怎么创建页面
最新发布
m0_73991249的博客
02-19 1766
1、下载安装：可以去b站跟着黑马程序员视频步骤，不做过多阐述，就是在第一个windows 642、创建项目打开软件，跟着图片来版本可能不同，样子会有所不同，我懒得按照我的来截图，我用的是黑马程序员的视频截图，但是内容是一样的，图片怎么选你就怎么选就行！记住先“不适用云服务”，不要选别的那些什么【模板】，语言选【基于js】的就行，AppID在这块，链接没用你就按照下面图片来然后就出来了。
查看微信小程序网页源代码
招财进宝
08-08 1万+
关键步骤记录如下 一、安装及启用X5内核 要强制微信使用 X5 内核，打开网页及小程序用 com.tencent.tbs.core.webkit.WebView，这样才能开启调试。 下面一些开启调试的指令，直接访问下面的网站，开启调试模式，修改配置后记得重启微信： http://debugx5.qq.com http://debugtbs.qq.com http://debugmm.qq.com/...
微信小程序仿微信主界面UI源代码.rar
07-10
这是一个运行于微信环境的小程序，正好是模拟制作的微信主界面和功能，源代码目录很规范，编写微信相关的小程序，运用的知识技巧是很综合的，这涉及到音频处理、查找联系人、信息、日志、消息、新朋友发现、日志记事、上传模块、微信聊天模块等，这个小程序模拟出了大部分的微信功能，同样具备微信的四大模块：微信消息、通讯录、发现、我。每个模块都有详尽的代码，对感觉学习微信我想是帮助比较大的。 　　这里面同时也有摇一尧扫一扫的功能，还有附近的人，漂流瓶
微信小程序_简单页面实现（附demo）
03-29
本页面制作者：司小文，来自原文地址 这篇文章主要是用微信小程序的一些基本组件，做了一个简单的页面来和小伙伴们一起分享，如果有问题欢迎留言。   先看下效果图： (此图片来源于网络，如有侵权，请联系删除! )     js代码部分:   [javascript] view plain copy    print? Page({     data: {       names: [           '处置列表',           '约诊',           '消息',           '顾客信息'       ],       navsText: [           '../a
微信小程序——小程序页面生成器（截图+源码）.zip
04-25
微信小程序——小程序页面生成器（截图+源码）.zip、 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip 微信小程序——小程序页面生成器（截图+源码）.zip
小程序页面生成工具
01-29
小程序页面生成工具，freemaker完成。。。。简单页面生成
生成任意页面小程序码
mygoes
08-21 1096
生成任意页面小程序码 生成小程序二维码，实现通过扫码跳转到小程序的指定页面。 操作步驟： 进入草料二维码官网，依次点击"首页" → “更多工具” → “小程序参数码” 进入参数码生成主页面。 点击 “立即使用”。 点击 “扫码授权”，使用已綁定小程序的微信帐号扫码授权。 点击 “+新建模板”，填好信息后点击 “保存”。注意要在 "参数信息"→ “参数路径” 处填写小程序中对应页面的路径。 点击 “生成小程序码” 完毕 ! ...
微信小程序 - 基础 - 002 - WEUI - 一个基本页面的设计 - index页面的制作
热门推荐
山云的专栏
07-29 3万+
1 前言： 本系列依据微信给出的实例，进行比较细致的解读和逐步分析、实践。 遇到很小的知识点，也做了一点的分析和解释，希望是能够帮助0起步的同学。 大虾们请选择跳过， 开始讨论一个微信小程序的页面设计，结合微信给出的实例。 2 页面构建的基本框架： 微信小程序的文件组织是一个迭代的层次，如我前面一片博文里面提到的： https://blog.csdn.net/yellow_hill/...
微信小程序实例代码
Elisa384的博客
02-22 373
index.wxml: <view class="container"> <view class="selection" style="border:0"> <swiper indicator-dots="true" autoplay="true" interval="3000" duration="1000"> ...
微信小程序-关于我们页面模板
CY的博客
06-17 2598
微信小程序-关于我们页面模板
WeChat------微信小程序相关动态页面代码总结
COCOLI_BK的博客
06-09 2106
<!-- wxml --> <view class="page" data-weui-theme="{{theme}}"> <view class="page__hd"> <view class="page__title">WeUI</view> <view class="page__desc">WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身.
小程序——关于我们页面
Abenazhan的博客
05-16 9936
1.新建目录，建立在page 文件夹目录下2.建立页面文件，js，json，wxss，wxml3.复制其他页面的js，json，wxss，wxml文件修改注释名字。4.配置新页面： "pages":[ "pages/about/about", "pages/index/index", "pages/logs/logs" ],5. 修改wxml页面，删除页面之间的&lt;view...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值