![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
Zxy-9
这个作者很懒,什么都没留下…
展开
-
elementui-plus+vue3+vite构建工具模板——路由配置
elementui-plue提供了 Vite 模板clone到本地后,执行npm i然后安装路由npm install vue-router在项目中创建views文件夹,并添加一个vue文件,这里名为hello.vue,并写一些简单的模板代码新建一个router文件,在router目录下新建index.js文件,如果不想把router路径写在这个文件下,还可以添加几个文件用来管理路径,再进行导出即可,这里先都写在index.js下,代码如下:import { createRouter,原创 2022-04-14 13:04:25 · 2076 阅读 · 1 评论 -
vue3升级部分(一)
之前一直是用vue2来写项目的,现在实习工作也不是很忙,闲下来记录一些vue2和vue3对比有哪些升级的部分。1. ref在vue2中的用法在vue2中,如果我们想要一个dom节点,需要以下两步:使用ref给元素注册引用信息;在方法中利用this.$refs.xxx便可获取该dom元素;//示例代码<template> <div> <ul> <li v-for="(item,index) in lis原创 2022-04-11 12:51:10 · 868 阅读 · 0 评论 -
vue3升级部分(二)-composion API
1. ref在vue2中的用法在vue2中,如果我们想要一个dom节点,需要以下两步:使用ref给元素注册引用信息,在方法中利用this.$refs.xxx便可获取该dom元素//示例代码<template> <div> <ul> <li v-for="(item,index) in list" :key="index" :ref="name">{{item.nam}}</li>原创 2022-04-06 08:36:04 · 448 阅读 · 0 评论 -
Vue的兄弟组件传值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <style> </style></原创 2021-04-24 09:56:50 · 80 阅读 · 0 评论 -
Vue的computed,directive,mount,refs,nexttick
ComputedDirectivemountrefsnexttick模板内虽然也可以进行计算,但函数用多了看起来就会很麻烦,所以我们使用computed属性computed具有缓存属性,计算属性必须是一个函数<div id="app"> {{msg}} <div v-for="i in new Array(10)"> {{msg2}}</div> <input type="button" value="btn" @click=原创 2021-04-13 19:43:17 · 238 阅读 · 0 评论 -
Vue
Vue生命周期(很全面,超级详细!!)keep-alive原创 2021-04-13 19:57:34 · 70 阅读 · 0 评论 -
vue项目的创建
原创 2021-03-30 15:14:19 · 58 阅读 · 0 评论 -
Vue中避免滥用this去读取data中的数据
原文原创 2021-03-27 14:34:40 · 157 阅读 · 0 评论 -
vue小案例—记事本
css部分 *{ margin: 0; padding: 0; } .book{ display: flex; justify-content: center; align-content: center; } #todoapp{ width: 300px; border:.原创 2020-11-24 14:24:01 · 257 阅读 · 0 评论 -
在利用vue3创建项目时,怎么关闭eslint
在eslint的试用过程中,由于它对代码的检查,使得我们在练习过程中会有很多的麻烦最彻底的解决方法如下:在选择完Manually select features (手动配置)以后 Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection) // 检查项目所需的功能:(按<space>选原创 2021-01-25 20:26:45 · 526 阅读 · 2 评论 -
关于vue中的一些错误总结
这是由于没有转到对应目录下,cd 创建的文件夹即可npm ERR! code ENOENTnpm ERR! syscall opennpm ERR! path E:\xxx\views\front\package.jsonnpm ERR! errno -4058npm ERR! enoent ENOENT: no such file or directory, open 'E:\xxx\views\front\package.json'npm ERR! enoent This is relate原创 2021-01-25 21:16:37 · 42 阅读 · 0 评论 -
利用bootstrap和vue做的一个设备管理系统小demo(只有前端版)
一.主要功能利用Vue和bootstrap来实现一个设备管理系统,主要功能为:1.增加产品的信息(包括产品名称,产品价格,生产厂家和产品数量)2.删除某一条产品信息(在点击删除时会弹出警示框)3.点击全部删除按钮,会将已经录入的产品全部删除二.代码实现1.首先引入bootstrap中的框架,对整体进行布局(到官网直接引用后更改文字描述即可)2.设置添加按钮,绑定add()add(){ this.equipments.push(this.newEqu原创 2021-03-24 21:27:59 · 1115 阅读 · 0 评论