微信小程序使用weui怎么只有样式功能却用不了?

微信小程序使用weui怎么只有样式功能却用不了?,第1张

方法/步明烂骤

下载 weui.wxss

请点击输入图片描述

解压缩文件,可以看到如下文件

请点击输入图片悔槐敬描述

打开开发者工具,新建一个项目

请点击输入图片描述

下面的小程序初始化的文件内容及结构

请点击输入图片描述

找到上述文件dist/style目录下weui.wxss

请点击输入图片描述

将weui.wxss放到小程序项目的更目录下

请点击输入图片描述

引用weui.wxss,在碧慎app.wxss引入

请点击输入图片描述

实验weui.wsxx

请点击输入图片描述

查看效果,此时说明我们的样式已经引用成功。

请点击输入图片描述

一、需求:

swiper组件缩小后需要完全居中。

二、实现方案:

一种方式是flex居中,但我调试后效果不行;还有闷升芦一种就是绝对定位,使用left 50%,这种我调试也不居中;还有一种就是计算屏幕宽度和swiper宽度,绝对定位后left=(屏幕width-swiper width)/2,本文介绍最后一种实现方式。

三、蚂带程序实现

3.1 js文件

data声明变量

onload时计算参数值

3.2 wxss文件

使用绝对定位,left使用变量,格式: var( --变量名--)

3.3 wxml文件

swiper外用一个view组件,并笑陪使用变量,格式:style="--left--:{{动态变量}}px"

四、实现效果


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/12209845.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-21
下一篇 2023-05-21

发表评论

登录后才能评论

评论列表(0条)

保存