vue方法
vue直接使用方法汇集
淡忘_cx
热爱技术的普通人
展开
-
升级package.json文件里依赖版本
【代码】升级package.json文件里依赖版本。原创 2022-12-21 11:03:56 · 563 阅读 · 0 评论 -
JS对URL进行编码和解码
【代码】JS对URL进行编码和解码。原创 2022-10-21 15:09:48 · 440 阅读 · 0 评论 -
wangEditor富文本使用 【vue3】使用
wangEditor 【vue3】使用原创 2022-06-08 18:58:11 · 2475 阅读 · 0 评论 -
node.js数组存数据库方式(小记)
转成json存入数据库接受数据把json转成数组原创 2022-06-01 17:15:23 · 501 阅读 · 0 评论 -
vue3 使用和风天气插件
<div id="he-plugin-standard" />onMounted(() => { window.WIDGET = { 'CONFIG': { 'layout': '2', 'width': 280, 'height': 360, 'background': '1', 'dataColor': 'FFFFFF', .原创 2022-05-22 18:01:59 · 1396 阅读 · 3 评论 -
vue3通过PC客户端IP定位显示天气和风天气(通过IP定位方式+搜狐api+和风天气api+高德api)
第一步:获取ip在index.html引入 <script src="https://pv.sohu.com/cityjson?ie=utf-8"></script>在vue文件<script setup>const cip = ref('')//ip地址const tqlng = ref('')//ip地址省份onMounted(() => {cip.value = returnCitySN['cip']cname.value = return原创 2022-05-22 17:57:59 · 1149 阅读 · 0 评论 -
vue3截取url数据方法
const data = ref({})function GetRequest() { //url例子:www.baidu.com?id="123456"&name="www"; var url = decodeURI(window.location.search); //?id="123456"&name="www"; var object = {}; if (url.indexOf("?") != -1)//url中存在问号,也就说有参数。原创 2022-05-10 16:56:50 · 1681 阅读 · 0 评论 -
arco.design(字节ui库)自定义上传限制文件类型和数量例子
arco.design(字节ui库)自定义上传限制文件类型和数量例子 <a-upload :file-list="form.maininformation" :action="Activity" //上传接口配置 @success="uploadfile" @before-upload="beforeUpload" @before-remove="deletedata" />// 上传文件前校验function beforeUpload(resolve) { l原创 2022-04-13 15:51:19 · 2838 阅读 · 0 评论 -
uuid随机id生成
// 存储登录密匙const loginkey = ref()const uuid = ref(null)// 存储注册密匙const registrationkey = ref()function uuid() { var s = [] var hexDigits = '0123456789abcdef' for (var i = 0; i < 36; i++) { s[i] = hexDigits.substr(Math.floor(Math.原创 2022-04-11 17:31:42 · 472 阅读 · 0 评论 -
vue数组引用本地图片无效解决方法
vue数组引用本地图片无效解决方法错误写法[ { src:'../../890.jpg' }]正确写法[ { src:require('../../890.jpg') }]原创 2022-04-09 07:42:15 · 801 阅读 · 0 评论 -
解决node打包内存泄露问题
问题例如FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory命令行cmd ,dos窗口运行:cnpm install -g increase-memory-limit进入项目文件夹,运行:increase-memory-limit可临时解决问题腾讯云构建在编译前-创建2个shell 脚本即可...原创 2022-04-07 14:33:16 · 322 阅读 · 0 评论 -
切换pnpm 包管理器 源
切换pnpm源原创 2022-03-09 16:04:40 · 8074 阅读 · 0 评论 -
vue3 使用腾讯云验证码
在index引入js <script type='text/javascript' src="https://ssl.captcha.qq.com/TCaptcha.js"></script>使用 <el-button class="button" type="primary" size="medium" @click="verificationCode">查询</el-button>方法function verificationCode()原创 2022-03-01 10:36:45 · 1294 阅读 · 0 评论 -
前端常用正则
前端常用正则[{名字: '火车车次',正则: /^[GCDZTSPKXLY1-9]\d{1,4}$/,示例: ['G1868', 'D102', 'D9', 'Z5', 'Z24', 'Z17']},{名字: '手机机身码(IMEI)',正则: /^\d{15,17}$/,示例: ['123456789012345', '1234567890123456', '12345678901234567']},{名字: '必须带端口号的网址(或ip)',正则: /^((ht|f)tps?原创 2022-02-22 14:30:27 · 576 阅读 · 0 评论 -
Vue3不再支持Filters过滤器,推荐使用计算属性来做过滤器(简单使用方法)
页面使用{{ 定义函数(传参) }}计算属性方法使用computed: { 定义函数: function() { // val为传进来的值 return function(传参) { //处理方法逻辑 return 回调参 } }例子处理名字显示一位页面使用//王小小{{ fnNameFilter(props.row.re原创 2022-02-21 18:10:19 · 2732 阅读 · 2 评论 -
tinymce 富文本自定义上传图片接口,并设置图片宽度(100%)解决小程序适配问题
组件<template> <div class="editor"> <TinymceEditor v-model="myValue" :init="completeSetting" :disabled="disabled" /> </div></template><script setup>import { goodsAlbumFilesUploadImage } from '@/api/com原创 2022-01-25 11:08:26 · 3137 阅读 · 0 评论 -
微信扫码登录非静默登录方式
第一步引入微信js <script type='text/javascript' src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>调出微信二微码 // 从微信的开发文档不难看出回调域名需要经过encodeURIComponent处理 var obj = new WxLogin({ self_redirect: false, // 扫码后默认重新打开的原创 2021-12-31 09:59:29 · 516 阅读 · 0 评论 -
vue3获取url后面参数
获取url参数例如http:www.fyi.com?a=321&b=yui方法let a = router.currentRoute.value.query.alet b = router.currentRoute.value.query.b原创 2021-12-31 09:55:20 · 3323 阅读 · 0 评论 -
vue3,vue2使用clipboard进行复制
1.安装依赖npm install --save vue-clipboard32.使用 <van-button square text="复制" type="success" class="delete-button" @click='clickBtn(value)'/>vue3<script>import { defineComponent } from '@vue/composition-api'import useClipboard from 'vue-cl原创 2021-12-09 09:23:43 · 2709 阅读 · 1 评论 -
Vue 获取自定义时间范围 今天,昨天,一个月,仨月等,时间处理
moment.js是一款现在对时间处理的强大的函数,如果没有安装的话先执行npm install moment<template> <a-select @change="changeRecent"> <a-select-option value="3"> 近 3 天 </a-select-option> <a-select-option value="7"> 近 1 周 </a原创 2021-12-07 17:40:29 · 753 阅读 · 0 评论 -
根据窗口大小设置宽高
高(宽换个属性即可):style="{height: myHeight}"data() { return { myHeight: (window.innerHeight - 200) + 'px' } }, mounted() { // 注:window.onresize只能在项目内触发1次 window.onresize = function windowResize() {原创 2021-10-11 16:01:00 · 185 阅读 · 0 评论 -
微信服务号一键登录
getCode () { // 非静默授权,第一次有弹框 this.code = '' var local = window.location.href // 获取页面url var appid = 'wxefd7' this.code = this.getUrlCode().code // 截取code if (th原创 2021-09-17 22:56:59 · 303 阅读 · 0 评论 -
.vue文件结构
<template> <div class="container"> </div></template><script type="text/ecmascript-6">export default { data(){ return{ // 数据 }; }, components:{ // 组件注册 }, beforeCreate(原创 2021-08-26 10:05:17 · 84 阅读 · 0 评论 -
vuex最简单使用版
这里我把项目整个结构截图,store/index就在这里、在里面进行变量的定义、管理和派生具体内容如下import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({ state: { //定义变量stuName,可以定义多个 stuName: '', }, mutations: { //存取学生姓名 用户通过触发这个方法,来保存数据,payload就是用户存进来的原创 2021-08-12 14:40:43 · 18222 阅读 · 0 评论 -
windows下搭建vue项目环境加创建项目超详细小白步骤!
1. 第一步安装node.js官网:https://nodejs.org/zh-cn/2.下载好按步骤安装“推荐都默认”3.点开运行调用出cdm输入node -v npm -v 出现版本号就是安装完成了注意不要乱升级npm 以免造成问题 下面是官方对应的版本,安装node.js自带npmhttps://nodejs.org/zh-cn/download/releases/为了提高我们的效率,可以使用淘宝的镜像:http://npm.taobao.org/输入:npm in原创 2021-06-08 14:26:20 · 18911 阅读 · 0 评论 -
如何在uni-app使用vuex如何将vuex模块化!
一、使用vuex由于uni-app已经内置了vuex,所以只要正确引入就好了。1、在项目的根目录下,创建一个名为store的文件夹然后在该文件夹下创建一个index.js的js文件2、在该js文件下定义公共的数据以及方法函数,并且把它导出import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({ state: {}, mutations: {}, acti原创 2021-05-18 15:50:33 · 19176 阅读 · 0 评论 -
项目上线流程
第一步文件底部创建下面文件夹:vue.config.jsmodule.exports = {publicPatb:'./xxx'}备注1. npm run build 打包代码2.把代码给后端3后端把前端代码放入后盾工程4.后端重启服务*容易出现问题的就是下面的配置...原创 2021-02-25 20:39:44 · 18377 阅读 · 0 评论 -
前端常用获取后端请求方法(request·axios)
1.uni-app request请求uni.request({ url: 'http://localhost/myUniApp/php/login.php', //仅为示例,并非真实接口地址。 data: {//参数 rawData: rawData, code: loginRes.code }, header: { 'custom-header': 'hello' //自定义请求头信息 }, method:'POS原创 2021-02-25 07:19:15 · 20299 阅读 · 1 评论 -
vue数组创建与遍历组件模块
例子:<template> <div class="docker"> <div v-for="(item, index) in dockerList" :class="{'docker__item': true, 'docker__item--active': index === 0}" class="docker__item " :key="item.icon" > <div cla原创 2021-02-20 17:57:53 · 18674 阅读 · 0 评论