微信开发者工具创建一个小程序

news/2024/4/27 15:45:05/文章来源:https://blog.csdn.net/qq_59833893/article/details/137115446

创建项目

创建小程序
对于上面这个AppID可以自行选择是注册还是测试号,我是使用的测试号,之后再下面选择模板,我这里选择了JS-基础模板
进入项目后在模拟器中可看到如下页面:
项目首页

添加提交按钮进行页面跳转

  1. 添加需要跳转的文件夹,并在其中添加js、json、wxml、wxss文件:添加文件及文件夹

  2. 找到app.json文件:app.json文件

  3. app.json文件中找到pages配置,加入新增的文件配置:"pages/user/user",该属性注册会自动找到user文件夹下的js、json、wxml、wxss文件(如果根据显示的选择,应该选择wxml,不然编译会找不到user.wxml):提示
    添加注册pages属性

  4. 此时会编译会报错,user.json为空,只要在该文件中加入{}即可,当然也可以加入{"usingComponents": {}},其中usingComponents表示的是使用的组件,这样写组件是空的相当于{}报错

  5. 找到登录页面index.wxml编写“登录按钮”:<button type="primary" bind:tap="onSubmit">登录</button>

  6. 找到index.js开始编写onSubmit方法进行跳转,以下开始编写onSubmituser文件夹中的内容;

  // 登陆操作// 使用wx.navigateTo({})onSubmit() {wx.navigateTo({url: '/pages/detail/user',})}onSubmit() {wx.navigateTo({url: '/pages/user/user',success: function(res) {console.log("跳转成功")},fail: function(res) {console.log("跳转失败")}})}// 或者使用wx.redirectTo({})onSubmit() {wx.redirectTo({url: '/pages/user/user',success: function(res) {console.log("跳转成功")},fail: function(res) {console.log("跳转失败")}})}

【补充】其中实现跳转的方法还有:使用导航组件、标签、页面链接实现,将上述提到的index.wxml<button type="primary" bind:tap="onSubmit">登录</button>改为<navigator url="../user/user">登录</navigator>即可,这样就不需要再index.js中新增方法了。

<!-- user.wxml -->
<scroll-view class="scrollarea" scroll-y type="list"><view class="container">user page</view>
</scroll-view>

【注意】在user.js中一定至少要有:Page({}),不然实现跳转也是空的页面,不会显示user.wxml文件中的信息!!!user.js

微信开发者工具开发文档:https://developers.weixin.qq.com/doc/。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_1026526.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Leetcode 3.25

LeetCode Hot 100 栈1.有效的括号2.最小栈3.字符串解码 栈 1.有效的括号 有效的括号 这道题肯定是利用了栈先入后出的特性。有以下几种情况 如果当前元素是左括号则push进栈不弹出&#xff1b; 如果当前元素是右括号则弹出栈中前一个元素&#xff0c;并判断是否与当前元素匹配…

http模块—http请求练习

题目要求&#xff1a;搭建如下http服务&#xff1a; 1.当浏览器向我们的服务器发送请求时&#xff0c;当请求类型是get请求&#xff0c;请求的url路径地址是/login。响应体结果是登录页面 2.当浏览器向我们的服务器发送请求时&#xff0c;当请求类型是get请求&#xff0c;请求…

ubuntu 首次登录mysql8 未设置密码或忘记密码解决方法 亲测可用

-1.首先输入以下指令&#xff1a; sudo cat /etc/mysql/debian.cnf2. 再输入以下指令&#xff1a; mysql -u debian-sys-maint -p //注意! //这条指令的密码输入是输入第一条指令获得的信息中的 password ZCt7QB7d8O3rFKQZ 得来。 //请根据自己的实际情况填写&#xff01;运…

QT文件读写操作和内容提取

访问IO设备&#xff0c;需要先调用open()来设置正确的OpenMode(例如ReadOnly或ReadWrite) 打开设备后后&#xff0c;使用write() 或putChar() 写入数据到文件和设备&#xff0c;并通过调用read()&#xff0c;readLine() 或readAll() 进行读取&#xff1b;使用完设备后&#xf…

离线数仓(八)【DWD 层开发】

前言 1、DWD 层开发 DWD层设计要点&#xff1a; &#xff08;1&#xff09;DWD层的设计依据是维度建模理论&#xff08;主体是事务型事实表&#xff08;选择业务过程 -> 声明粒度 -> 确定维度 -> 确定事实&#xff09;&#xff0c;另外两种周期型快照事实表和累积型…

【自我提升】一、Hyperledger Fabric 概念梳理

写在前面&#xff1a;最近因为业务需要&#xff0c;开始学习Hyperledger Fabric了&#xff0c;做java全栈工程师可真难搞。现在算是啥类型的都在涉及了&#xff0c;现在这个技术啥都不懂&#xff0c;就先开个学习专栏&#xff0c;记录记录。顺带也给各位道友参考参考。 目录 …

【Bug】记录2024年遇到的Bug以及修复方案

--------------------------------------------------------分割线 2024.3.22------------------------------------------------------- 1、load_sample_image raise AttributeError(“Cannot find sample image: %s” % image_name) AttributeError: Cannot find sample imag…

[linux初阶][vim-gcc-gdb] OneCharter: vim编辑器

一.vim编辑器基础 目录 一.vim编辑器基础 ①.vim的语法 ②vim的三种模式 ③三种模式的基本切换 ④各个模式下的一些操作 二.配置vim环境 ①手动配置(不推荐) ②自动配置(推荐) vim是vi的升级版,包含了更加丰富的功能. ①.vim的语法 vim [文件名] ②vim的三种模式 命令…

WPF —— DockPanel、ProgressBar 控件详解

ProgressBar 控件详解 1Progress bar简介 ProgressBar&#xff1a;进度条控件。 WPF带有一个方便的控件用于显示进度&#xff0c;称ProgressBar。它的工作原理就是设置最小值和最大值然后通过递增一个值&#xff0c;这样就可以直观的显示当前进度情况。 2 Progress bar常用的…

DFS:从递归去理解深度优先搜索

一、深入理解递归 二、递归vs迭代 三、深入理解搜索、回溯和剪枝 四、汉诺塔问题 . - 力扣&#xff08;LeetCode&#xff09; class Solution { public: //笔试题&#xff0c;不讲武德&#xff0c;CAvoid move(int n,vector<int>& A, vector<int>& B, ve…

前端实现浏览器自定义滚动条

前言&#xff1a; 最近有个项目&#xff0c;产品觉得浏览器默认滚动条太丑了。想美化一下&#xff0c;比如自定义颜色&#xff0c;加上圆角&#xff0c;宽高都要更改一下。我查了资料和文档总结了一下 写法&#xff0c;特此记录以便之后使用。 浏览器滚动条api 总结&#xff…

【爬取网易财经文章】

引言 在信息爆炸的时代&#xff0c;获取实时的财经资讯对于投资者和金融从业者来说至关重要。然而&#xff0c;手动浏览网页收集财经文章耗时费力&#xff0c;为了解决这一问题&#xff0c;本文将介绍如何使用Python编写一个爬虫程序来自动爬取网易财经下关于财经的文章 1. 爬…

代码随想录 Day-25

力扣题目 509.斐波那契数 思路 很理所当然的&#xff0c;可以使用递归的方式其次是用动态规划的方式&#xff0c;动态规划的核心就是递推公式。 那么递推和递归一字之差&#xff0c;有什么区别呢&#xff1f;&#xff08;递推和递归的区别&#xff09; 1、递归 class Solutio…

Java项目:77 springboot母婴商城

作者主页&#xff1a;源码空间codegym 简介&#xff1a;Java领域优质创作者、Java项目、学习资料、技术互助 文中获取源码 项目介绍 本课题后端使用SpringBoot Spring Cloud框架&#xff0c;前端采用html&#xff0c;JQuery&#xff0c;JS&#xff0c;DIVCSS技术进行编程&…

Redis中AOF文件重写与同步

AOF文件的写入与同步 Redis服务器进程就是一个时间循环(loop),这个循环中的文件时间负责接收客户端的命令请求&#xff0c;以及向客户端发送命令回复&#xff0c;而时间事件则负责执行像serverCron函数这样需要定时运行的函数。因为服务器在处理文件事件时可能会执行些命令&am…

【Java程序设计】【C00416】基于(JavaWeb)Springboot的客户管理系统(含论文)

基于&#xff08;JavaWeb&#xff09;Springboot的客户管理系统&#xff08;含论文&#xff09; 项目简介项目获取开发环境项目技术运行截图 博主介绍&#xff1a;java高级开发&#xff0c;从事互联网行业六年&#xff0c;已经做了六年的毕业设计程序开发&#xff0c;开发过上千…

C# 文件操作

文章目录 C# 文件操作创建文件运行结果 写入文件程序文件运行结果 WriteAllLines-写入多行运行结果 追加字符串运行结果追加多行字符串 读取文件ReadAllText运行结果 ReadAllLines-用数组接收读取的内容运行结果 采用流&#xff08;Stream&#xff09;的方式来读取内容运行结果…

stm32平衡车

目录 一.所需材料 二.PID算法&#xff08;简单说明&#xff09; 直立环 速度环 串级PID 三.使用到的外设 1.定时器输出比较-PWM 2.定时器编码器模式 3.编码器读取速度 4.电机驱动函数 5.外部中断 四、小车 调试 一.所需材料 1.陀螺仪MPU6050--读取三轴的加速度…

C++:梦的开始——创建第一个hello world(1)

我这里使用的编写代码的工具是Start Experimental Instance of Visual Studio 2022 你可以去微软的官网上寻找&#xff0c;并且安装 部署项目 项目就是一个文件夹&#xff0c;他将我们的数据都放到了里面&#xff0c;这就是一个项目 在Visual Studio 2022中 选择c 的空项目&a…

【Linux 08】进程概念

文章目录 &#x1f308; 01. 基本概念&#x1f308; 02. 描述进程 PCB&#x1f308; 03. 使用 ./ 的方式创建进程&#x1f308; 04. ps 查看进程&#x1f308; 05. getpid / getppid 获取进程标识符&#x1f308; 06. kill 终止指定进程&#x1f308; 07. fork 创建子进程&…