随笔分类 - 前端 / vue
摘要：实现了使用后端的排序，前端只负责向后端发送请求要数据就可以了。 整个代码的简单逻辑就是，后端定义好的接口，前端使用逻辑获取前端是想正序、逆序还是无排序，然后将排序拼接到url中，发送给后端就行了。 代码如下： ```html ```
阅读全文
摘要：# 安装clipboard包 ```bash npm install vue3-clipboard ``` # 在main.js中进行配置 ```js import VueClipboard from 'vue3-clipboard' const app = createApp(App) use(V
阅读全文
摘要：```js // 导入包 import axios from "axios"; // 使用示例 axios.post('发送请求地址', { 携带变量key1: 变量value1, 携带变量key2: 变量value2, }).then(response => { // 后端返回给前端的数据都在re
阅读全文
摘要：主要用于跨组件传输数据，emit可以调用父组件中的自定义函数。 # 使用方法 ```js let emit = defineEmits(['父组件自定义函数1', '父组件自定义函数2', '...']) // 调用父组件自定义函数的执行 emit('父组件自定义函数') ``` # 主要逻辑 1.
阅读全文
摘要：# 安装 ```js npm install vue-cookies ``` ```js import VueCookies from 'vue-cookies' const cookies = VueCookies cookies.set('key值', '字符串或变量'， '7d') // 7d
阅读全文
摘要：收录一些后台管理模板 django-vue-admin: https://gitee.com/liqianglog/django-vue-admin D2admin: https://gitee.com/mirrors/D2admin 15 个优秀的 Vue 后台管理模板：https://cloud
阅读全文
摘要：创建项目 vue_cli创建项目 vue_cli的安装见：https://www.cnblogs.com/smyz/p/17309086.html 使用vue_cli创建项目与创建vue2.0项目步骤相同 # 1. 进入到相关目录 # 2. 使用下面的命令进行创建 vue create 项目名称 v
阅读全文
摘要：简介 vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。 vue-router是基于路由和组件的，路由用户设定访问路径的，将路径和组件映射起来。在vue-router的单页面应用中，页面的路径的改变就是组件的切换。 官网地址：https://ro
阅读全文
摘要：简介 cookies 临时存储在客户端中，并且有过期事件，到过期时间会被自动清理。 sessionStorage 临时存储在客户端中，关闭浏览器后就会清空。 localStorage 永久存储在客户端中，只有在清空缓存或手工删除或代码删除后才会清空。 localStorage的使用 语法 // 将值
阅读全文
摘要：常用样式库 常用的Vue样式库如下 |组件库|说明|地址| |-|-|-| |element|目前只支持到vue2.x版本，不再更新|https://element.eleme.cn/#/zh-CN| |element-plus|样式与element相同，开发都为了在vue3.x版本中使用而升级|h
阅读全文
摘要：作用 vue的插件的作用就是为了增强Vue，比如router，比如Vuex 本质就是包含install方法的一个对象，install的第一个参数是vue，第二个及之后的参数是使用都要传递的数据，插件对象中的install方法会被vue自动调用。 使用 在Vue项目的src目录中创建目录plugins
阅读全文
摘要：简介 可以把多个组件共用的配置提取成一个混入对象。比如有两个组件，两个组件中有部分共同的内容，比如同样的变量，同样的函数等。这时候可以把这些共用的提取出来做成混入对象。 局部使用 在src目录中创建一个目录，我这里的目录名称就为mixin 在mixin目录中创建一个js文件，为了方便导入，所以创建的
阅读全文
摘要：说明 当一个父组件定义了style之后，子组件的相关style也会受到影响，这时可以通过添加scope属性解决。 代码 <!--将h1标签定义为背景色为gree，这时，子页面的h1标签也会受到影响--> <style> h1 {background-color: green} </style> 解决
阅读全文
摘要：什么是Vue-CLI Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。Vue CLI是一个脚手架，通俗点说就是代码生成器，可以快速生成一套基于Vue完整的前端框架，单独编译，单独部署。可以再集成各种第三方插件，扩展出更多的功能。 为什么要使用Vue-CLI（来自官网） https:
阅读全文
摘要：简介 当一个变量的值发生变化时，执行对应的函数 语法 # 在属性中添加watch属性，并以需要监听变量的名字进行定义函数 data:{show: 'abc'} watch:{ show(){ 我是函数内容 } } 示例 <!DOCTYPE html> <html lang="en"> <head>
阅读全文
摘要：简介 在vue中，如果在methods中定义了一个函数，也是可以通过插值语法调用的，但会产生一个问题，如果有多个输入框使用了v-model，这时不管输入的内容是否与这个函数有关，这个函数都会执行一次，这样会让降低运行效率，为了解决这个问题，可以使用计算属性 计算属性效果： 计算属性只有在它的相关依赖
阅读全文
摘要：[toc] > # 简介 > 组件（component）是vue.js最强大的功能之一。组件的作用就是封装可重用的代码，通常一个组件就是一个功能体，便于在多个地方都能够调用这个功能体。 每个组件都是Vue的实例对象。 我们实例化的Vue对象就是一个组件，而且是所有组件的根组件 > 在工程化工发后，一
阅读全文
摘要：介绍 Vue实例有一个完整的生命周期，也就是从开始创建初女台化数据、编译模板、挂载DOM、渲染一更新一渲染、卸载等一系列过程，我们称这是Vue的生命周期。 生命周期： vue实例从创建到销毁的过程。 生命周期钩子： 就是生命周期事件的别名而已 钩子函数 描述 创建期间的生命周期函数 beforeCr
阅读全文
摘要：按键事件 按键事件就是，按了键盘的一个按键，就会触发绑定函数的执行。 |按键|说明| | | | |keyup|按键弹起的时候触发（最常用）| |keydown|按键按下的时候触发| |keypress|按键按压的时候触发| 语法 # 在标签上进行定义 @keyup="函数" @keydown="函
阅读全文
摘要：简介 在vue中，当修改了变量，页面内容会根据变量的变化而变化。但是如果页面变化了，变量不会变化，这个就是单向数据绑定。当页面变化，变量也会跟着变化，这个是双向数据绑定 语法 <input type="text" v-model="变量"> 示例 <body> <div id="app"> <!--
阅读全文
