微信小程序多页面引用一个公共页

这篇具有很好参考价值的文章主要介绍了微信小程序多页面引用一个公共页。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

这段时间在项目中遇到一个购物车的需求,tabBar页面需要购物车,在购物界面也要能跳转到购物车;

之前的做法是直接跳转到tabBar的购物车页面,但是这种跳转既不流畅,也不美观;

于是只能新建一个页面,做成和tabBar的购物车一样的,但是程序员都很懒,即使是复制一个页面也无法接受,于是就在寻找多个页面引用一个功能页面的方法,经过测试终于得出一套可行的方案,仅供参考!

首先介绍一下微信小程序wxml、wxs、js引用其他文件的方法

wxml - include(还有另一个import,这里不做介绍,可以到官网去看)

官网的解释:include 可以将目标文件除了 <template/> <wxs/> 外的整个代码引入,相当于是拷贝到 include 位置。意思就类似于 c 的宏定义,直接拷贝粘贴。文章来源地址https://www.toymoban.com/news/detail-494472.html

<!-- index.wxml -->
<include src="header.wxml"/>
<view> body 

到了这里,关于微信小程序多页面引用一个公共页的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序在web-view页面增加一个按钮

    需求: 在微信小程序中通过web-view打开H5页面,需要小程序端在页面中增加一个可以请求接口的按钮 实现方法 通过在web-view中嵌套cover-view标签来实现( 注意: cover-view只支持嵌套 cover-view、cover-image,可在 cover-view 中使用 button,但是本人在里面使用button标签时,对button添加样式无效

    2024年02月07日
    浏览(71)
  • uni-app微信小程序,在页面顶部添加返回按键,返回上一个页面

    1.示例: 2.实现方式: 在page.json文件中的style里添加如下代码: 3.tips: 在page.json中的页面顺序就是小程序加载过程中的页面顺序

    2024年02月12日
    浏览(48)
  • 微信小程序通过wx.navigateBack实现返回上一个页面并调用方法

    需求 从A页面跳到B页面,B页面执行完所有步骤后返回A页面并调用A页面的方法 实现方法 主要用到 wx.navigateBack 和 wx.navigateTo 两个路由跳转方法,从A跳向B需要使用 wx.navigateTo ( 千万不能使用wx.redirectTo,这个跳转后页面就会销毁,无法通过wx.navigateBack返回 ) 参考文档 小程序官方对路

    2024年02月15日
    浏览(47)
  • uni-app 返回上一个页面并传递参数(微信小程序)

    方法一 问题: 会记住每次返回. 并在下次获取参数时把所有的返回监听进行 全部返回 ( 不确定别人使用时是否会出现此问题 ) 打印示例结果如下: 打印说明: 获取用户信息1: 为每次进入第二个页面 (onload) 请求的数据 监听到事件来自返回的参数: 为第一个页面监听获取的数据 方

    2024年02月09日
    浏览(67)
  • 微信小程序点击按钮在当前页面弹出一个弹窗输入数据

    微信小程序中可以使用 wx.showModal 或 wx.prompt 来在当前页面弹出一个弹窗,让用户输入数据。 使用 wx.showModal 时可以设置模态框的标题、内容和按钮文字,当用户点击确定或取消按钮时会返回一个对象,其中 confirm 属性表示用户是否点击了确定按钮,cancel 属性表示用户是否点

    2024年02月12日
    浏览(45)
  • 一码多端,一个二维码适用微信小程序,支付宝小程序,h5页面

    最近公司研发自己的一个小程序,因为是线下树牌,涉及到扫码这个问题,但是扫码又分三个端,浏览器扫码,微信扫一扫,支付宝扫码,做这个需求也是遇到了很多坑,在此记录一下 1.扫码进入微信小程序 首先登录微信公众平台,链接 https://mp.weixin.qq.com/  原本此处会有一

    2024年02月08日
    浏览(73)
  • 让chatgpt编写一个微信小程序的对话页面,它是这么整的,我懵了

    请阅读这份文档https://tdesign.tencent.com/miniprogram/components/cell?tab=demo。使用腾讯的miniprogram tdesign UI库编写一个微信小程序的对话页面,要求消息在一侧,用户头像统一在左侧,每条消息底下有重用和复制按钮,点击可以把消息内容复制到粘贴板。消息输入框可以输入多行文字。

    2024年02月04日
    浏览(45)
  • uniapp微信小程序全局所有页面放置一个跳转首页的可以拖动的悬浮按钮

    把上面的静态解构放到src/components/movable/movable.vuewe文件作为自定义组件 此处用的到时uniapp的movable-area组件和内嵌 movable-view 组件,其中movable-area表示可拖动的范围,movable-view用于指示可拖动的区域。 参照文档:movable-area | uni-app官网     movable-view | uni-app官网 想要实现每个页

    2024年02月03日
    浏览(46)
  • uniapp微信小程序:点击按钮先判断用户是否授权位置信息、用户位置信息授权、进入下一个页面

    前提 :该实例是使用uniapp的小程序 实现的 文章描述: 这里要实现的功能是: 1、点击页面中的一个按钮 2、判断用户是否授权位置信息 3、未授权–弹出位置授权框;已授权–进入下一个页面(地址选择页); 4、弹出位置授权框后,是否同意授权 5、同意:得到地址;不同

    2024年02月08日
    浏览(55)
  • 微信小程序 跳转页面经常会遇到判断是否登录情况。基于此需求,做了一个路由跳转拦截的jump组件

    组件代码非常简单 在根目录创建components目录 在components目录新建jump目录 在jump目录新建四个文件 index.js index.json index.wxml index.wxss 这个样式文件内容空就行

    2024年02月09日
    浏览(53)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包