![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
Mr_wuying
这个作者很懒,什么都没留下…
展开
-
vue知识点————$nextTick
在项目中我们要跟后端请求数据,拿到数据处理后渲染DOM,然后可能根据业务需求,要求对DOM节点进行一些操作或者,或者DOM节点,这时会出现DOM没更新完后,你获取DOM是拿不到的。在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。但是会报错说DOM节点不存在。因为我的DOM节点是根据后端返回数据多少个循环的。比如我在项目中用到了echarts。要拿到DOM的节点渲染。所以这里就会用到**$nextTick**原创 2023-09-13 15:28:16 · 276 阅读 · 1 评论 -
Electron 两个线程
Electron:它允许使用最初为Web应用程序开发的前端和后端组件开发桌面GUI应用程序:后端的Node.js运行时和前端的Chromium。每个Electron应用都有两个线程:一个是主线程(处理应用窗口和启动),另一个是渲染线程(基本上是您的UIWeb代码)。还有一个预加载脚本,用于连接两个 “世界”。渲染器线程Electron使用Chromium在称为渲染过程的独立过程中显示网页。这个线程处理/src文件夹中的UI代码。 在这里你将无法使用Node.js的强大功能,但预加载脚本将允原创 2023-09-07 16:18:07 · 1058 阅读 · 0 评论 -
vue 知识点———— data为什么是个函数
【代码】vue 知识点———— data为什么是个函数。原创 2023-09-07 15:55:30 · 202 阅读 · 0 评论 -
vue知识点————插槽 slot
父组件< template > < div id = " app " > < child url = " https://www.baidu.com " v-slot = " slotProp " > 百度---{{ user.name }}地址为{{ slotProp.url }} < script > import child from "./components/child.vue";原创 2023-09-07 15:50:52 · 400 阅读 · 0 评论 -
vue 知识点———— 生命周期
Vue实例从创建到销毁的过程,叫生命周期。从开始创建、初始化数据、编译模版、挂载Dom-渲染、更新-渲染、销毁等过程。原创 2023-09-07 12:03:46 · 401 阅读 · 0 评论 -
vue中用到element的 弹框做echarts 的展示 报错Error in v-on handler: “Error: Initialize failed: invalid dom.“
所以要在 this.$nextTick 里面写echarts 展示的功能去获取dom节点。点击按钮的时候我要弹框显示出来并且 echarts图标展示出来。这里翻译出来就是找不到对应的有效dom。原创 2023-04-28 11:37:19 · 446 阅读 · 0 评论 -
vue中用echarts 报Cannot read properties of undefined (reading ‘init‘)
最好官网的引用不是这样的应该改成下面就会好了。在main.js引用的是。原创 2023-04-27 14:47:38 · 251 阅读 · 0 评论 -
element 设置table 隔行样式
【代码】element 设置table 隔行样式。原创 2023-04-26 17:57:35 · 134 阅读 · 0 评论 -
element table 文字居中改变 表头背景颜色
这里有个现象 当表格内容都居中 表头会自动居中。并且这里还可以改变table 表头的样式。原创 2023-04-26 16:30:22 · 147 阅读 · 0 评论 -
element table设置某列背景颜色
这里的返回值是四个 文档中有写到{row, column, rowIndex, columnIndex}**columnIndex 是列 rowIndex 是行 **这里根据判断第几列设置颜色。自己可以打印看一下返回的值。原创 2023-04-26 16:16:46 · 1803 阅读 · 1 评论 -
vue2 中 Cannot find name ‘activeIndex‘.ts(2304)
发现个小问题不影响页面,但是在编辑器中一直有红线标注很不舒服,找了半天原因找到了,因为我在vue2中没有用ts,这个问题找弄了很久才发现。在这里找到vue3 并且把他关闭后了,重新加载后页面代码显示就正常了。发现是vscode编辑器中的扩展导致的。原创 2023-04-26 12:01:21 · 197 阅读 · 0 评论 -
vue使用element的布局 发现没有撑满全屏
注意要是样式写在style里 要覆盖element的样式不可以在style上添加。这么写的话是覆盖不住element的样式的 必须把。给el-contaniner 添加一个高度。Main 没有把页面其余部门撑满。原创 2023-04-24 15:38:42 · 1139 阅读 · 0 评论 -
<router-link> - did you register the component correctly? For recursive comp
vue 项目中添加了route 发现配置文件搞好后路由的。原创 2023-04-24 15:28:43 · 144 阅读 · 0 评论 -
vue使用scss 报错 Failed to resolve loader: sass-loader You may need to install it.
两个都运行完成后 再运行项目没有报错的话就可以用了。原创 2023-04-24 15:27:31 · 397 阅读 · 0 评论 -
wabpack 打包资源动态分配地址 获取当前资源文件夹名称
wabpack打包资源动态分配地址 获取当前资源文件夹名称原创 2022-07-19 15:27:53 · 477 阅读 · 2 评论 -
svg 根据鼠标滑动画曲线
借鉴 添加链接描述dome 展示原创 2022-03-21 17:22:50 · 987 阅读 · 2 评论 -
vue 中canvas 根据点画出圆滑的曲线
文件BezierMaker.jsvar BezierMaker = function(canvas, bezierCtrlNodesArr, color) { // this.canvas = canvas this.ctx = canvas this.bezierCtrlNodesArr = bezierCtrlNodesArr ? bezierCtrlNodesArr : [] this.color = color ? color: '#ffffff' thi原创 2022-03-11 15:22:20 · 1961 阅读 · 4 评论 -
js数组对象排序
var compare = function (prop) { return function (obj1, obj2) { var val1 = obj1[prop]; var val2 = obj2[prop]; if (!isNaN(Number(val1)) && !isNaN(Number(val2))) { val1 = Number(val1); val2 = Number(原创 2022-03-03 14:04:25 · 192 阅读 · 0 评论 -
vue 在固定区域内拖拽
<template> <div id='pondModel'> <span v-for='(item,index) in 6' :key='index' @mousedown="move" ></span> </div><template>methods: { move(e){ let odiv = e.target let disX =e.clientX - odiv.offsetLe原创 2022-03-03 11:11:29 · 2520 阅读 · 1 评论 -
vue滚动条滚动到底部触发事件
//获取节点 const scrollDiv = this.$refs.mypklogList //vue的写法 mypklogList是表现中 ref=“mypklogList” const scrollDiv=document.getElementById(‘id’) //js的写法 上面的和这个选择一个 const offsetHeight = scro...原创 2019-07-21 15:43:45 · 5730 阅读 · 0 评论 -
vue 改变div的滚动条位置
在vue里要改变div的 滚动条<ul ref="ulScroll1"></ul>this.$refs.ulScroll1.scrollLeft=15 //距离左 横滚动条this.$refs.ulScroll1.scrolltop=15 //距离右 竖滚动条这里会出现一个问题是 我们的数据是动态获取的这里设置了 滚动条 会没有任何变化那是因为 数据会没有渲染出来 滚动条还未出现解决的办法就是 在请求完数据后 做一个定时器 延迟一下 滚动条的设置 100原创 2020-09-20 17:16:27 · 4417 阅读 · 0 评论 -
app原生调用H5页面的方法 来传递参数
在h5页面中 我们会和原生的进行交互 传参等这里就不写h5怎么给原生传参了 我前几篇文章中 有写到这里是要原生给我们传参 但是不在链接后也 不是在 本地存储因为我们要做到页面不刷新的情况改变页面的样式function toSignUpName(city,id) { $('.toSignUpDiv span').html(city) arid=id}//该方法 是原生调用的方法 并且传入 城市名称和id 我们改变自己页面的状态即可 原生的写法如果是用vue 写的h5页面 我们要暴露原创 2020-09-20 17:09:15 · 3141 阅读 · 0 评论 -
vue $refs 动态拼接获取值
div是循环 所以img 的ref是动态设置的 要获取对应点击的 <div class="unionLiveDiv" v-for="(item,index) in cityLivelist" :key='index' > <div class="unionLiveImg"> <input type="file" v-if='item.redact' @change='filePush1(cityLivelist,index,"img"+i原创 2020-06-04 16:01:13 · 13718 阅读 · 0 评论 -
vue 获取上传图片的宽高
<input type="file"@change='filePush1()' ref='fileImg'/>filePush1(){ this.$refs.fileImg[0].naturalHeight //图片实际高度 this.$refs.fileImg[0].naturalWidth //图片实际宽度}原创 2020-06-04 15:30:33 · 3250 阅读 · 0 评论 -
vue项目配置favicon图标
大家每次看到的网站都有一个小的logo这是favicon图标在vue中我们先要 安装插件npm i --save-dev html-webpack-plugin安装完成后 我们要在配置文件中配置一下前提是有ico格式的图片我图片是放在了外面同级这是我们要配置一下开发环境路径是根据我放图片的位置写的 后面就是配置生产环境 也是一样的打包生成的文件图片因为我放在了最外层 所有生成出来会和index同级这时部署完项目就OK了...原创 2020-06-03 17:14:27 · 735 阅读 · 0 评论 -
vue打包引用文件路径不对以及修改打包文件名
vue打包会自动生成这是部署到服务器上的文件但是你会发现项目打开是空白的 那是因为index.html文件中引用的路径不对这是你要手动改index页面中所有引用路径 在 /static前加上 . 改成./static但是手动改比较麻烦 每次打包都要改 这时你要改一下webpack打包文件**config 文件下的index文件 中 assetsPublicPath: ‘/’, 这改成assetsPublicPath: ‘./’,**就可以了 每次打包路径就会正常index: ’原创 2020-06-03 17:01:00 · 3036 阅读 · 3 评论 -
vue打包项目 本地图片有个别图片未显示出来
vue打包 会自动把图片转换成base64 这样的图片会显示正常 如果没有显示正常说明图片路径有问题这里说的是 图片路径没问题却有个别图片没有显示那是因为本地的个别图片没有转换成base64 如果是请求的网路图片是不会转换的 请求网络图片都会显示正常因为打包的时候 图片太大不会转换base64 因为会加大负担这里如果是本地图片不正常 就要改变webpack 打包的文件代码build 文件中的webpack.base.conf.js 文件module: { rules:原创 2020-06-03 15:16:28 · 2735 阅读 · 0 评论 -
vue 分环境打包配置
在config下新建 test.env.js 文件在prod.env.js 文件中改成// 改成你的环境域名就行 正式和测试的'use strict'const target = process.env.npm_lifecycle_event;if (target == 'test') { //测试 var obj = { NODE_ENV: '"produc...原创 2019-11-09 21:18:16 · 317 阅读 · 0 评论 -
vue 请求代理 做跨域解决
vue的项目 我们后台的接口有的时候回出现跨域这时候vue 可以做代理在config文件下的index.js文件里找到proxyTable 一开始是proxyTable:{} 空的 改成下面的dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable...原创 2019-11-09 21:05:33 · 363 阅读 · 0 评论 -
vue数据请求 并封装方法加代理
先npm install axiosnpm install axios我自己分装了请求方法所以单独的建了一个文件创建了utils文件夹 在里面新建了 request.js文件request.js文件import axios from 'axios';import VueCookies from 'vue-cookies';//这是cookies的npm 根据自己的需求这个可以忽略...原创 2019-11-09 20:57:24 · 946 阅读 · 0 评论 -
vue 动态改变图片 图片存在本地的
在项目中要改变一个背景图片或者icon 因为存在了本地项目中 直接改变路径发现图片没有显示出来所有要改变引用方法,如果是从服务器直接拿到的图片路径直接赋值给img的src中就行<img :src='img' />data(){ return:{ img:require("@/assets/shopNoIcon_b.png"), //收藏icon }}//改变的时候...原创 2019-11-09 20:32:03 · 904 阅读 · 0 评论 -
vue数据更新dom没渲染
在更新数据代码后面写上this.$forceUpdate();或者用watch监听sukList是你data中的数据字段监听到数据更新 重新赋值watch: { sukList(newVaule,oddVaule){ this.sukList=newVaule } }...原创 2019-11-09 20:25:13 · 613 阅读 · 0 评论 -
vue获取链接后参数
在router中设置参数 { path: '/t:accid', name: 't', component: resolve => require(['@/components/roomitem'], resolve), //直播间 },accid 就是你要的参数多个参数后面直接加 :冒号跟参数名称跳转的时候给参数结合上面的设置<...原创 2019-11-05 19:28:55 · 5011 阅读 · 0 评论