- 博客(36)
- 资源 (1)
- 收藏
- 关注
原创 vue3 复制文本
是一个为 Vue.js 框架设计的剪贴板操作库,它基于 Vue 3 Composition API。它提供了简单易用的方式来实现在 Vue.js 应用中复制文本到剪贴板的功能,而不需要手动处理浏览器的剪贴板 API。
2024-04-18 15:59:34
419
原创 vue3中列表使用van-list数据调用了两次解决方法
onMounted不调用数据接口getData。请求数据时参数size写的条数多一些。因为请求数据过少,覆盖页面不足就会二次加载数据。设置:immediate-check="false"还是有问题。finished-text="没有更多了"
2024-03-14 13:55:16
1118
原创 textarea输入#被截断解决方法
是 JavaScript 中的一个内置函数,用于对 URL 中的特殊字符进行编码。它将字符串作为参数,并返回一个编码后的字符串,以便安全地在 URL 中使用。函数会对字符串中的所有非字母数字字符进行编码,包括特殊字符。它会将这些字符转换为它们的十六进制表示,并在每个编码字符前添加。等,它们在 URL 的语义中有特殊的含义。为了避免破坏 URL 结构或产生歧义,我们需要对这些特殊字符进行编码。函数,我们可以确保在 URL 中安全地传输包含特殊字符的字符串,而不会破坏 URL 的语义或产生错误。
2023-09-21 17:37:30
296
原创 vue3 h5判断是否是微信浏览器
这段代码首先使用正则表达式来测试navigator.userAgent字符串是否包含"micromessenger"(微信浏览器的标识)。来检测当前浏览器是否为微信浏览器。
2023-05-24 14:13:07
1793
原创 vue3使用js-cookie
3、设置cookies(第三个参数可选填),以确定cookie是否已过期。4、获取cookie。5、删除cookie。
2023-05-24 14:03:50
1022
原创 keep-alive实现不同页面跳转列表页的缓存状态
实现效果:home首页跳转list页面不缓存,detail页面返回list页面保留缓存。路由页面定义keep-alive和isbackrouter - index.js{ path: '/home', name: 'home', component: () => import ('../views/home.vue'),},{ path: '/list', name: 'list', component: () => ...
2022-04-27 16:32:59
585
原创 vue3 使用vue-router
1.首先安装vue-routernpm install vue-router@next查看package.json是否安装成功2.main.js页面引入import { createApp } from 'vue'import App from './App.vue'import router from './router'const app = createApp(App)app.use(router)app.mount('#app')3.新建router文件夹 in
2022-03-03 11:02:59
1447
原创 vue3 更新vue-cli版本报错解决
cmd 以管理员身份运行node.js 版本太低的话 建议卸载 然后去官网重新下载安装node.jsvue cli版本太低需要卸载重新安装npm uninstall -g vue-clinpm install -g @vue/cli然后vue-create 创建项目即可
2022-03-03 09:22:13
752
原创 uniapp 时间排序
<view class="column" v-for="(item,index) in listData" :key="index">{{item.time}}</view>data() { return { data:[], }},computed: { listData: function () { return this.data.sort(this.sortTime); },},methods: .
2021-11-30 15:39:01
1663
2
原创 uniapp 跳转外部链接web-view
<web-view :src="url" :progress="true"></web-view>data() { return { url: '',}},onLoad(options) { this.url = options.url},备注:nvue 使用需要手动指定宽高
2021-11-30 15:30:05
2312
原创 uniapp swiper组件实现tab导航滑动切换文本内容
swiper组件可以做滑动切换,但是必须设置一个固定的高度,每一个swiper-item里的内容后台返回的文字内容不一样,就会造成内容不能自动撑开,会被截取重点:使用nextTick延时设置//导航<view class="tab-menu row acenter"> <view :class="{'cur':type==1}" @tap="menuClick(1)"> <text>导航一</text> </v
2021-11-29 17:39:45
1920
原创 uni-app上传图片给后台
页面<view @tap="uploadImg"> <image v-if="imgSrc" :src="imgSrc"></image> <view v-if="!imgSrc">点击上传</view></view>方法uploadImg(){ uni.chooseImage({ count: 1, //默认9 sizeType: ['compressed']
2021-09-09 11:05:37
1324
原创 uni-app点击复制文本
<view> <text>{{copyText}}</text> <view @tap="copyClick">点击复制</view></view>//适用小程序和app的点击复制copyClick() { uni.setClipboardData({ data:this.copyText, success: function (res) { uni.getCli.
2021-09-09 10:54:40
564
原创 uni-app swiper实现通知上下循环滚动
swiper实现通知上下循环滚动<template><view><swiper circular="true" vertical="true" autoplay="true" interval="3000" duration="1000"> <swiper-item v-for="(item,index) in noticeList" :key="index"> <v
2021-09-09 10:42:53
2188
原创 uni-app修改checkbox样式
<style> uni-checkbox .uni-checkbox-input { border-radius: 50% !important; color: #ffffff !important; } uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked { color: #fff; background: #1953ed; }</style>
2021-09-08 18:01:25
169
原创 uni-app修改swiper里dot的样式
<style> /* 首页的banner dot效果 */ .home uni-swiper .uni-swiper-dot { width:6rpx; height:6rpx; } .home uni-swiper .uni-swiper-dot-active { width: 34rpx; border-radius: 20rpx; }</style>必须写在App.vue页面
2021-09-08 17:58:57
764
原创 uni-app自定义底部tabbar实现某个tab的显示和隐藏
自定义的tabbar可用v-if实现某个tab的显示和隐藏页面<view class="tab-box row acenter"> <navigator class="grow1 column acenter jcenter" url="/pages/index/index" open-type="redirect"> <image src="@/static/images/tab_home_nor.png"></image>
2021-09-08 17:48:12
4007
原创 uni-app开发安卓app的封装get和post及页面使用
const baseUrl = ""//get请求//get请求封装export function getRequest(url,params){ return new Promise((resolve, reject) => { uni.request({ url: baseUrl + url, data: params, method:"GET", dataType:'json', header:{ 'conte
2021-09-08 17:21:18
221
原创 vue 点击按钮div input focus问题解决
<div @click="clickFocus"></div><inputref="inputbox"v-model="inputText"type="text" >methods:{clickFocus(){this.$nextTick(()=>this.$refs.inputbox.focus());},}...
2021-09-08 17:07:39
611
原创 vue的H5项目中使用@scroll滚动加载数据
<divv-if="this.isPc==true"class="list-wrap"ref="list"@scroll="handleScroll"></div>
2021-05-21 14:06:58
494
原创 vue项目中使用可编辑div contenteditable
<div ref="InputContainer" contenteditable="true" spellcheck="false" placeholder="文字"></div>spellcheck 属性规定是否对元素进行拼写和语法检查css设置placeholder文字的颜色*[contenteditable="true"]:empty:before { content: attr(placeholder); color: #A9A9A9...
2021-05-20 17:42:43
523
原创 vue项目列表跳转详情再返回列表还在原位置
kee-alive是Vue内置的一个组件,可以使被包含的组件保留状态,或避免重新渲染。也就是所谓的组件缓存1.app.vue<template> <div id="app"> <!-- <router-view/> --> <!-- 可以被缓存的视图组件 --> <keep-alive> <router-view v-if="$route.meta.keepAlive"&...
2021-05-20 17:28:07
776
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人