vue
2019ab
没有事情就在CSDN
展开
-
Vue3中Pinia状态管理库学习笔记
store/counter.jspinia的核心Statestore/user.jspinia的核心Gettersstore/counter.js网络请求stores/counterstores/home感谢大家观看,我们下次见原创 2024-03-14 21:14:21 · 1144 阅读 · 0 评论 -
Vue3中Vuex状态管理库学习笔记
引入 store/index.js。原创 2024-03-03 13:13:02 · 969 阅读 · 0 评论 -
Vue3--Vue Router详解--学习笔记
Vue-Router的使用,学习笔记。欢迎大家观看指正...原创 2023-11-19 19:10:43 · 434 阅读 · 0 评论 -
Vue3-Composition-API-学习笔记
Vue3的Composition-API开发模式,学习笔记原创 2023-11-10 22:52:40 · 674 阅读 · 0 评论 -
Vue3的手脚架使用和组件父子间通信-插槽(Options API)学习笔记
Vue3中Options API学习笔记原创 2023-11-05 18:11:41 · 626 阅读 · 0 评论 -
uni-app 190扫一扫加入群聊功能(二)
/pages/chat/scan-add/scan-add.nvue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar title="加入群聊" showBack :showRight="false"></free-nav-bar> <view class="p-5"> <view class="bg-white rounded p-4"原创 2022-03-10 14:19:29 · 1008 阅读 · 0 评论 -
uni-app 189扫一扫添加群聊功能(一)
/components/free-ui/free-nav-bar.vue<template> <view> <view :class="getClass"> <!-- 状态栏 --> <view :style="'height:'+statusBarHeight+'px'"></view> <!-- 导航 --> <view class="w-100 flex align-center原创 2022-01-20 16:04:12 · 370 阅读 · 0 评论 -
uni-app 188修复弹框问题
弹框问题/components/free-ui/free-nav-bar.vue<template> <view> <view :class="getClass"> <!-- 状态栏 --> <view :style="'height:'+statusBarHeight+'px'"></view> <!-- 导航 --> <view class="w-100 flex align-ce原创 2022-01-20 15:37:16 · 639 阅读 · 0 评论 -
uni-app 187多进程实现(二)
/app/extend/context.js// app/extend/context.jsvar qr = require('qr-image');module.exports = { // 成功提示 apiSuccess(data = '', msg = 'ok', code = 200) { this.body = { msg, data }; this.status = code; }, // 失败提示 apiFail(data = '', msg = 'f原创 2022-01-19 17:45:18 · 731 阅读 · 0 评论 -
uni-app 186多进程实现(一)
/app.jsclass AppBootHook { constructor(app) { this.app = app; } configWillLoad() { // 此时 config 文件已经被读取并合并,但是还并未生效 // 这是应用层修改配置的最后时机 // 注意:此函数只支持同步调用 } async didLoad() { // 所有的配置已经加载完毕原创 2022-01-19 16:57:33 · 1867 阅读 · 0 评论 -
uni-app 185iOS端兼容处理
朋友圈样式问题/pages.json{ "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages { "path" : "pages/common/login/login", "style" : {原创 2022-01-19 16:22:04 · 650 阅读 · 0 评论 -
uni-app 184查看好友朋友圈完善(五)
前端将H5的修改同步到APP里/pages/find/moments/moments.nvue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;">原创 2022-01-16 17:18:35 · 163 阅读 · 0 评论 -
uni-app 183查看好友朋友圈完善(四)
如下图是我测试的截图前台/pages/mail/user-base/user-base.vue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar showBack :showRight="detail.friend" bgColor="bg-white"> <view slot="right"> <free-icon-button v-if=.原创 2022-01-16 16:53:41 · 652 阅读 · 0 评论 -
uni-app 182查看好友朋友圈完善(三)
如下是我测试的截图前台/pages/find/moments/moments.vue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;"> &.原创 2022-01-16 16:28:06 · 174 阅读 · 0 评论 -
uni-app 181查看好友朋友圈完善(二)
前台/pages/find/moments/moments.vue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;"> <image src=原创 2022-01-16 16:05:29 · 166 阅读 · 0 评论 -
uni-app 180查看好友朋友圈完善(一)
前端H5同步APP代码/common/free-lib/chat.jsimport $U from "./util.js";import $H from './request.js';import $store from '@/store/index.js';class chat { constructor(arg) { this.url = arg.url this.isOnline = false this.socket = null this.reconnectConfi原创 2022-01-13 18:06:10 · 192 阅读 · 0 评论 -
uni-app 179转发名片功能
/pages/chat/chat-list/chat-list.vue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar title="选择" showBack :showRight="true"> <free-main-button :name="muliSelect ? '发送 ('+selectCount+')' : '多选'" slot="right" @click原创 2022-01-13 17:19:32 · 144 阅读 · 0 评论 -
uni-app 178添加背景提示音(二)
解决iOS端提示音自动播放下面是源码视图/manifest.json{ "name" : "WChat", "appid" : "__UNI__DAD2A12", "description" : "", "versionName" : "1.0.0", "versionCode" : "100", "transformPx" : false, /* 5+App特有相关 */ "app-plus" : { "usingCo原创 2022-01-13 14:47:31 · 1842 阅读 · 0 评论 -
uni-app 176添加背景提示音(一)
/common/free-lib/chat.jsimport $U from "./util.js";import $H from './request.js';import $store from '@/store/index.js';class chat { constructor(arg) { this.url = arg.url this.isOnline = false this.socket = null this.reconnectConfirm = 0 this原创 2022-01-12 18:16:11 · 373 阅读 · 0 评论 -
uni-app 175app端兼容处理(二)
/pages/find/moments/moments.nvue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;"> <image src="h原创 2022-01-12 17:13:05 · 265 阅读 · 0 评论 -
uni-app 174app端兼容处理(一)
首先我们将所有的.vue文件改为.nvue,如下图注意,这里是pages文件夹下面所有的.vue文件结尾的然后我们修改 manifest.json文件,如下图所示原创 2022-01-11 18:06:11 · 368 阅读 · 0 评论 -
uni-app 173小程序端兼容处理
/common/free-icon.css/* @font-face {font-family: "iconfont"; src:url('/static/font_1365296_2ijcbdrmsg.ttf') format('truetype')} */@font-face {font-family: "iconfont"; src:url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAACNcAAsAAA原创 2021-12-22 09:40:56 · 23659 阅读 · 0 评论 -
uni-app 172标签列表和标签用户列表
app/router.js // 标签列表 router.get('/tag/list',controller.tag.list); // 标签用户列表 router.get('/tag/read/:id',controller.tag.read);app/controller/group.js'use strict';const Controller = require('egg').Controller;class TagController extends Control原创 2021-12-27 23:00:00 · 581 阅读 · 0 评论 -
uni-app 171部分小细节优化
/pages/mail/user-base/user-base.vue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar showBack :showRight="detail.friend" bgColor="bg-white"> <free-icon-button slot="right" v-if="detail.friend"><text class="原创 2021-12-22 23:30:00 · 129 阅读 · 0 评论 -
uni-app 170邀请加入群聊(二)
下图是我测试截图感谢大家观看,我们下次见原创 2021-12-22 22:30:00 · 435 阅读 · 0 评论 -
uni-app 169邀请加入群聊(一)
app/router.js// 将某人加入群 router.post('/group/invite',controller.group.invite);app/controller/group.js'use strict';const Controller = require('egg').Controller;class GroupController extends Controller { // 获取群聊列表 async list() { const { c原创 2021-12-27 08:30:00 · 366 阅读 · 0 评论 -
uni-app 168将某人踢出群聊(三)
/pages/chat/chat-set/chat-set.vue<template> <view style="background-color: #EDEDED;"> <!-- 导航栏 --> <free-nav-bar title="聊天信息" showBack :showRight="false"></free-nav-bar> <view class="flex flex-wrap py-3 bg-white">原创 2021-12-26 23:15:00 · 153 阅读 · 2 评论 -
uni-app 167将某人踢出群聊(二)
app/router.js // 将某个群成员踢出 router.post('/group/kickoff',controller.group.kickoff);app/controller/group.js'use strict';const Controller = require('egg').Controller;class GroupController extends Controller { // 获取群聊列表 async list() { co原创 2021-12-27 08:15:00 · 2051 阅读 · 7 评论 -
uni-app 166将某人踢出群聊(一)
/pages/chat/group-user/group-user.vue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar title="选择" showBack :showRight="false"> </free-nav-bar> <!-- 搜索框 --> <view class="p-3 bg-light position-fi原创 2021-12-26 23:00:00 · 124 阅读 · 0 评论 -
uni-app 165查看聊天记录功能
/pages/chat/chat-history/chat-history.vue<template> <view class="page"> <!-- 导航栏 --> <free-nav-bar title="聊天记录" showBack :showRight="false"> </free-nav-bar> <!-- 搜索框 --> <view class="p-3 bg-light position-原创 2021-12-26 22:00:00 · 491 阅读 · 0 评论 -
uni-app 164Token错误时自动退出
/common/free-lib/chat.jsimport $U from "./util.js";import $H from './request.js';import $store from '@/store/index.js';class chat { constructor(arg) { this.url = arg.url this.isOnline = false this.socket = null this.reconnectConfirm = 0 this原创 2021-12-25 21:15:00 · 5208 阅读 · 2 评论 -
uni-app 163断线自动重连处理
/common/free-lib/chat.jsimport $U from "./util.js";import $H from './request.js';import $store from '@/store/index.js';class chat { constructor(arg) { this.url = arg.url this.isOnline = false this.socket = null this.reconnectConfirm = 0 this原创 2021-12-24 09:00:00 · 806 阅读 · 0 评论 -
uni-app 162初始化会话列表功能
/pages/chat/chat/chat.vue<template> <view> <!-- 导航栏 --> <free-nav-bar :title="detail.name" :noreadnum="totalNoreadnum" showBack> <free-icon-button slot="right" @click="openChatSet"><text class="iconfont font-lg"&g原创 2021-12-23 19:00:00 · 436 阅读 · 0 评论 -
uni-app 161朋友圈查看权限
下图是我测试的截图/pages/find/add-moment/add-moment.vue<template> <view class="px-3"> <!-- 导航栏 --> <free-nav-bar showBack :showRight="true"> <free-main-button name="发表" slot="right" @click="submit"></free-main-button>原创 2021-12-22 20:00:00 · 108 阅读 · 0 评论 -
uni-app 160提醒谁看功能
/pages/mail/mail/mail.vue<template> <view> <!-- 导航栏 --> <free-nav-bar title="选择" showBack :showRight="true"> <free-main-button :name="buttonText" slot="right" @click="submit"></free-main-button> </free-n原创 2021-12-21 20:15:00 · 151 阅读 · 0 评论 -
uni-app 159发布朋友圈-实时通知
/pages/find/moments/moments.vue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;"> <image src="ht原创 2021-12-22 19:15:00 · 184 阅读 · 0 评论 -
uni-app 158发布朋友圈-上传短视频
下图是我测试截图/pages/find/add-moment/add-moment.vue<template> <view class="px-3"> <!-- 导航栏 --> <free-nav-bar showBack :showRight="true"> <free-main-button name="发表" slot="right" @click="submit"></free-main-button>原创 2021-12-21 17:15:00 · 203 阅读 · 0 评论 -
uni-app 157发布朋友圈-批量上传图片
如下是我测试的截图/components/free-ui/free-upload-image.vue<template> <view class="flex flex-wrap"> <view style="width: 230rpx;" v-for="(item,index) in imageList" :key='index' class="flex align-center justify-center pt-2 position-relative">.原创 2021-12-20 21:00:00 · 405 阅读 · 0 评论 -
uni-app 156朋友圈评论表情包功能
如下图是我测试截图这里我们主要将数据库存储类型改为 utf8mb4_general_ci将表moment_comment的排序规则 utf8mb4_general_ci感谢大家观看,我们下次见原创 2021-12-20 09:31:00 · 823 阅读 · 0 评论 -
uni-app 155朋友圈评论功能(二)
下图是我测试的截图/pages/find/moments/moments.vue<template> <view> <free-transparent-bar :scrollTop="scrollTop" @clickRight="clickRight"></free-transparent-bar> <view class="position-relative" style="height: 620rpx;"> &l.原创 2021-12-25 09:15:00 · 770 阅读 · 2 评论