- 博客(55)
- 收藏
- 关注
RSS订阅原创 微信小程序更换头像的功能
button按钮须设置 open-type="chooseAvatar" 这个属性，并绑定事件 bindchooseavatar="chooseAvatar"这样我们就能拿到图片本地的临时路径，然后使用wx.uploadFile方法把图片传到服务器便可。
2024-03-28 11:45:20
1272
原创 原生小程序开发的父子组件传值，兄弟组件传值
在组件1 引入import PubSup from 'pubsub-js'， 通过PubSup.publish('info',{name:'zhansgan',age:20});在组建2 引入import PubSup from 'pubsub-js'，在生命周期去接收。需要使用pubsub-js这个插件，下载npm install pubsub-js。
2024-03-21 09:37:55
378
原创 vue3后台管理系统权限路由的实现
2.在main.js同目录建立permission.js。这样就实现该功能，登陆页面就是登陆保存token的操作。7.组件LeftSubMenu.vue的代码。
2024-03-15 11:47:26
1538
原创 vue3中全局变量的定义和获取
在vue项目中，我们知道vue2定义全局变量是在main.js文件将变量挂载到vue.prototype.name="lisi"，在页面通过this.name去调用。
2024-03-06 10:34:41
2070
原创 vue3项目pinia的统一封装
注：pinia的持久化存储的插件 pnpm add pinia-plugin-persistedstate -D。1.stores下面定义index.js和modules文件夹分别创建cart.js和user.js。5.然后在需要使用的方法就可以直接其定义的变量和方法。4.下面室cart.js和user.js的内容。3.在main.js中引入pinia。其配置可以参照官方文件，
2023-12-14 14:37:48
1100
原创 vue3项目vscode Eslint配合Prettier代码规范配置
至此，代码规范配置完成，如果没有立即生效，可以尝试重启vscode。1.vue创建的时候选择elslint和prettier都选择。2.vscode安装eslint插件。
2023-12-14 10:05:48
1118
原创 vuex分模块时候state、mutations、getters、actions的使用
1.在store下面创建modules文件夹，并创建cart.js模块。2.在store/index.js引入上面的cart.js。记住这里namespaced属性一定要是设置为true。5.mutations和actions相同。3.state在前端页面的两种使用方式。4.getters在前端页面的使用方式。
2023-08-15 15:53:05
356
原创 uniapp app端微信、qq一键登录
注意：无论是微信登录还是qq登录一定要 -> 打开项目的manifest.json文件，在“App模块配置”项的“OAuth(登录鉴权)”下，勾选“微信登录”：填写微信appid。
2023-05-10 17:14:32
423
转载 flex-grow、flex-shrink、flex-basis 这三个属性
2.flex-grow 的默认值是0，表示盒子不会索取多余的父盒子的空间；如何设置其值大于0，表示索取，值越大索取的越多；，当父元素的宽度小于所有子元素的宽度的和时，子元素的宽度会减小。则A，B都不减小宽度，A、B的实际宽度为他们本身的宽度，即A的实际宽度为。则A、B的实际宽度为他们本身的宽度，即A的实际宽度为。的属性值进行分配 A 1/3 B 2/3；则最终 A 的大小为 自身宽度。则A的实际宽度为他本身的宽度=如果A，B都减小宽度，A设置。，则A不减小宽度，B减小。则 A 的实际宽度为。
2023-05-09 11:31:50
278
原创 vue打包补充
的文件，然后在该文件中进行相关配置。例如：module.exports = { // 配置项... };Vue项目在打包时，可能会出现体积过大、加载速度慢等问题。将常用的第三方依赖库通过CDN引入，这样可以减少打包体积，同时利用CDN的缓存提高加载速度。开启Webpack的性能提示，可以帮助你发现可能导致打包体积过大的问题。功能，将公共代码抽取成独立的文件，以便浏览器进行缓存。插件，可以自动删除不使用的CSS。插件，可以将生成的文件进行Gzip压缩。在项目根目录下创建一个名为。使用Webpack的。
2023-04-21 18:38:30
289
原创 vue2项目的打包优化（vue-cli@4）
5.对文件进行压缩（后端服务器也需要配置），注意插件的版本，否则打包报错。2.设置sourceMap 为false。3.使用插件去除consele.log。1.配置alias 别名。
2023-04-21 11:41:48
1449
原创 vue后端返回的图片为空或者路径错误，显示默认图片
这里解决问题的方式是使用vue自定义指令，注意vue中使用本地的图片路径需要使用require（）的方式引入。
2023-04-20 15:50:35
784
原创 vue2 使用 移动端rem适配
在main.js 中去引入 import 'amfe-flexible'在项目的目录下面创建postcss.config.js 文件，但需要注意的的是，行内样式是px是不转化为rem的。这样适配的问题就能解决了。
2023-04-11 15:13:20
600
原创 css 清除BFC，让浮动的内容和周围的内容登高
2.给父组件设置display: flow-root;1.给父盒子增加一个 overflow: auto;这个时候，可以使用两种方式改变这个情况。这样就能改变上述的问题。
2023-04-10 16:14:18
100
原创 vue2+vue-i18n+element-ui国际化（中英文切换）
1.首先导入：vue2 最好指定版本，最新的版本报错。2.在src下面创建lang/index.js。3.在main.js下面引用。
2023-04-06 18:09:08
698
原创 vue 页面引用多个组价的引入方式的优化
如果想改变这个样的方式，我们可以使用require.context()方法，然后就能直接使用指定文件夹下面的所有的组件了。先前我们假如想在一个页面引入多个组件，需要使用多个import,然后在components：{}去注册，
2023-03-23 11:30:43
326
原创 修改原生input的placeholder默认的颜色
input的原生样式其中placeholder的默认颜色是灰色，但有的时候需要修改这个默认字体的颜色，下面是实现的css的代码：
2022-06-17 11:39:25
1487
原创 使用swiper.js实现tab切换效果
手机站只做个切换的效果，平时我们直接使用tabs去切换可以实现，但是客户说下面内容部分切换没有滑动的效果，所以就使用swiper.js制作了这个简单的功能，这里去记录下：html部分：<ul> <li class="active">一楼</li> <li>二楼</li> <li>三楼</li></ul><div class="swiper-container"> <div
2022-05-23 11:39:48
1579
1
原创 将DIV的滚动条滚动到其子元素所在的位置
今天做个手机的页面，左侧栏目点击，右侧滚动到指定的位置，记录下：.page { max-width: 6.4rem; min-width: 3.2rem; margin: 0 auto; background-color: antiquewhite; display: flex; height: 100vh;}.lft { width: 2rem; overflow-y: auto; background-color: #ccc; box-sizing: border-box.
2022-05-21 10:31:23
785
原创 uniapp 实现tabs的效果（scroll-view+swiper）
<template> <view class="content"> <scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" :scroll-with-animation="true" :scroll-into-view="scrollinto"> <view v-for="(item,index) in list" :key="index" :id="'tab'+in.
2022-04-22 11:58:44
1115
转载 uniapp 横竖屏切换 返回 再次进入 页面内容样式错乱
今天做一个table需要展示的内容比较多，只能使用横屏的方式去展示，能解决横竖屏切换的问题，但是返回上一页再次点击进去，页面内容的样式全部变大，后来借鉴其他开发人员的帖子解决了问题，这里吧代码粘出来，记录下：1.在需要切换横竖屏的页面，onLoad 和 onUnload 这两个页面生命周期中添加代码分别为： onLoad() { // #ifdef APP-PLUS uni.showLoading({ title:"加载中..."
2022-04-09 17:14:25
2126
原创 vue-awesome-swiper 在vue 项目中的使用
在vue 项目中使用swiper轮播，找到个vue-awesome-swiper的组件，下面介绍下如何正确使用该组件：1.安装改组件cnpm i vue-awesome-swiper@3 -S这个下载的版本是"vue-awesome-swiper": "^3.1.3"2.在需要使用切换的界面引入该组件<script>import "swiper/dist/css/swiper.css";import { swiper, swiperSlide } from "vue-
2022-03-25 11:22:22
1827
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人