在项目中我们要跟后端请求数据,拿到数据处理后渲染DOM,然后可能根据业务需求,要求对DOM节点进行一些操作或者,或者
父组件< template > < div id = " app " > < child url = " https://www.baidu.com " v-slot = " slotProp " > 百度---{{ user.name }}地址为{{ slotProp.url }} < script > import child from "./components/child.vue";
【代码】vue 知识点———— data为什么是个函数。
Electron:它允许使用最初为Web应用程序开发的前端和后端组件开发桌面GUI应用程序:后端的Node.js运行时和前端线程Electron使用Chromium在称为渲染过程的独立过程中显示网页。这个线程处理/src文件夹中的UI代码。 在这里你将无法使用Node.js的强大功能,但预加载脚本将允
Vue实例从创建到销毁的过程,叫生命周期。从开始创建、初始化数据、编译模版、挂载Dom-渲染、更新-渲染、销毁等过程。
这里的返回值是四个 文档中有写到{row, column, rowIndex, columnIndex}**columnIndex 是列 rowIndex 是行 **这里根据判断第几列设置颜色。自己可以打印看一下返回的值。
vue 项目中添加了route 发现配置文件搞好后路由的。
两个都运行完成后 再运行项目没有报错的话就可以用了。
注意要是样式写在style里 要覆盖element的样式不可以在style上添加。这么写的话是覆盖不住
最好官网的引用不是这样的应该改成下面就会好了。在main.js引用的是。
这里有个现象 当表格内容都居中 表头会自动居中。并且这里还可以改变table 表头的样式。
发现个小问题不影响页面,但是在编辑器中一直有红线标注很不舒服,找了半天原因找到了,因为我在vue2中没有用ts,这个问题找弄了很久才发现。在这里找到vue3 并且把他关闭后了,重新加载后页面代码显示就正常了。发现是vscode编辑器中的扩展导致的。
【代码】element 设置table 隔行样式。
所以要在 this.$nextTick 里面写echarts 展示的功能去获取dom节点。点击按钮的时候我要弹框显示出来并且 echarts图标展示出来。这里翻译出来就是找不到对应的有效dom。
<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
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(
借鉴 添加链接描述dome 展示
在config下新建 test.env.js 文件在prod.env.js 文件中改成// 改成你的环境域名就行 正式和测试的'use strict'const target = process.env.npm_lifecycle_event;if (target == 'test') { //测试 var obj = { NODE_ENV: '"produc...
在更新数据代码后面写上this.$forceUpdate();或者用watch监听sukList是你data中的数据字段监听到数据更新 重新赋值watch: { sukList(newVaule,oddVaule){ this.sukList=newVaule } }...
vue的项目 我们后台的接口有的时候回出现跨域这时候vue 可以做代理在config文件下的index.js文件里找到proxyTable 一开始是proxyTable:{} 空的 改成下面的dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable...
先npm install axiosnpm install axios我自己分装了请求方法所以单独的建了一个文件创建了utils文件夹 在里面新建了 request.js文件request.js文件import axios from 'axios';import VueCookies from 'vue-cookies';//这是cookies的npm 根据自己的需求这个可以忽略...
在router中设置参数 { path: '/t:accid', name: 't', component: resolve => require(['@/components/roomitem'], resolve), //直播间 },accid 就是你要的参数多个参数后面直接加 :冒号跟参数名称跳转的时候给参数结合上面的设置<...
vue打包 会自动把图片转换成base64 这样的图片会显示正常 如果没有显示正常说明图片路径有问题这里说的是 图片路径没问题却有个别图片没有显示那是因为本地的个别图片没有转换成base64 如果是请求的网路图片是不会转换的 请求网络图片都会显示正常因为打包的时候 图片太大不会转换base64 因为会加大负担这里如果是本地图片不正常 就要改变webpack 打包的文件代码build 文件中的webpack.base.conf.js 文件module: { rules:
在项目中要改变一个背景图片或者icon 因为存在了本地项目中 直接改变路径发现图片没有显示出来所有要改变引用方法,如果是从服务器直接拿到的图片路径直接赋值给img的src中就行<img :src='img' />data(){ return:{ img:require("@/assets/shopNoIcon_b.png"), //收藏icon }}//改变的时候...
//获取节点 const scrollDiv = this.$refs.mypklogList //vue的写法 mypklogList是表现中 ref=“mypklogList” const scrollDiv=document.getElementById(‘id’) //js的写法 上面的和这个选择一个 const offsetHeight = scro...
大家每次看到的网站都有一个小的logo这是favicon图标在vue中我们先要 安装插件npm i --save-dev html-webpack-plugin安装完成后 我们要在配置文件中配置一下前提是有ico格式的图片我图片是放在了外面同级这是我们要配置一下开发环境路径是根据我放图片的位置写的 后面就是配置生产环境 也是一样的打包生成的文件图片因为我放在了最外层 所有生成出来会和index同级这时部署完项目就OK了...
在vue里要改变div的 滚动条<ul ref="ulScroll1"></ul>this.$refs.ulScroll1.scrollLeft=15 //距离左 横滚动条this.$refs.ulScroll1.scrolltop=15 //距离右 竖滚动条这里会出现一个问题是 我们的数据是动态获取的这里设置了 滚动条 会没有任何变化那是因为 数据会没有渲染出来 滚动条还未出现解决的办法就是 在请求完数据后 做一个定时器 延迟一下 滚动条的设置 100
vue打包会自动生成这是部署到服务器上的文件但是你会发现项目打开是空白的 那是因为index.html文件中引用的路径不对这是你要手动改index页面中所有引用路径 在 /static前加上 . 改成./static但是手动改比较麻烦 每次打包都要改 这时你要改一下webpack打包文件**config 文件下的index文件 中 assetsPublicPath: ‘/’, 这改成assetsPublicPath: ‘./’,**就可以了 每次打包路径就会正常index: ’
<input type="file"@change='filePush1()' ref='fileImg'/>filePush1(){ this.$refs.fileImg[0].naturalHeight //图片实际高度 this.$refs.fileImg[0].naturalWidth //图片实际宽度}
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
Copyright © 2005-2024 51CTO.COM 版权所有 京ICP证060544号