先看一下最终要实现的效果:登录页面:注册页面:(1)引入element-plus组件库引入组件库的方式有好多种,在这里我就在main.js全局引入了.npm i element-plus -S main.js中代码:import { createApp } from "vue"; //element-plus import ElementPlus fr ......
1955
0
0
2023-04-09
目录简介: 字符串写法:类名不确定,要动态获取对象写法:要绑定多个样式,个数确定,名字确定,但不确定用不用。数组写法:要绑定多个样式,个数不确定,名字不确定。 style方法 (键值要用小驼峰命名法)简介:绑定样式:    1、class样式     ......
421
0
0
2023-04-08
目录一. 场景再现二. 传递 Props三. provide 和 inject四. provide 的进阶用法五. 源码六. 思考题前言: 在前端项目中牵扯的最多的莫过于组件之间的传值了,除了最最常用的 props 和 emit,其实在 Vue 中还额外提供了另外几种方法。今天分享一种组件之间通信的方法。一. 场景再现先别着急考虑标题这个 api 的含义。在 ......
404
0
0
2023-04-07
目录准备:自定义指令介绍试炼:实现v-mymodel定义指令应用实践:4个实用的自定义指令权限控制输入限制内容处理文件预览试着自己实现总结准备:自定义指令介绍除了核心功能默认内置的指令 (v-model 和 v-show等),Vue 也允许注册自定义指令。注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件。然而,有的情况下,你仍然需要对普通 DOM ......
323
0
0
2023-04-07
目录1. 自定义v-model2. $nextTick3. slot 插槽4. Vue 动态组件5. Vue 异步组件6. 使用 keep-alive 缓存组件7. mixin 混入1. 自定义v-modelVue中的自定义v-model指的是在自定义组件中使用v-model语法糖来实现双向绑定。在Vue中,通过v-model指令可以将表单元素的值与组件实例 ......
302
0
0
2023-04-07
目录一、前提条件二、手动搭建vue项目的步骤:1. 创建项目2. 生成package.json文件3. 引入webpack和创建webpack.config.js文件4. 创建index.html,main.js文件5. 使用webpack命令编译6. 引入vue2,修改index.html,main.js文件7. 引入babel8. 再次执行webpack ......
378
0
0
2023-04-07
Vue Grid Layout官方文档Vue Grid Layout中文文档1. npm下载拖拽缩放库npm install vue-grid-layout@3.0.0-beta1 --save 2. vue3 使用 vue-grid-layout报错:external_commonjs_vue_commonjs2_vue_root_Vue_de ......
660
0
0
2023-04-04
笔记摘自:https://vue3js.cn (opens new window)的前端面试题库面试官:有使用过vue吗?说说你对vue的理解一、从历史说起Web是World Wide Web的简称,中文译为万维网我们可以将它规划成如下的几个时代来进行理解石器时代文明时代工业革命时代百花齐放时代石器时代石器时代指的就是我们的静态网页,可以欣赏一下1997的A ......
371
0
0
2023-04-04
目录1、导航守卫二、功能展示 三、原理四、功能实现⛵小结1、导航守卫“导航” 表示路由正在发生改变正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的。记住参数或查询的改变并不会触发进入/离开的导航守卫。你可以通过观察 $route 对象来应对这些 ......
490
0
0
2023-04-02
插槽的作用在组件入门这篇教程中,学院君已经给大家演示了插槽(slot)功能的基本使用,插槽的主要作用就是在组件中分发父作用域的内容,这个父作用域可以是 Vue 全局容器(可以看作是一个全局的「根组件」),也可以是父组件。说到这里,我们可以引用一张 Vue 官网提供的组件架构图,实际上,一个 Vue.js 应用就是基于下面这样的一个组件树来组织和管理页面元素的 ......
330
0
0
2023-03-26
目录一、一天的时间段预约1.点击预约时2.获取时间数组3.处理未来七天的函数4.点击切换星期状态5.选中时间点时,判断状态及改变状态6.保存7.弹窗关闭二、一月的天数预约(最少一天)一、一天的时间段预约会议预约有以下操作:1.点击预约按钮,弹窗最近一周的预约时间点(半小时一个点),预约时间为5:00到24:00;2.超过当前时间的时间点不允许再预约,已经预约 ......
601
0
0
2023-03-24
目录选择框架Vue Composition API导入依赖代码分割懒加载异步组件分割API请求有条件加载组件CSS完善加载状态取消API请求Stale While Revalidate更新指示总结单页面应用(SPAs)当处理实时、异步数据时,可以提供丰富的、可交互的用户体验。但它们也可能很重,很臃肿,而且性能很差。在这篇文章中,我们将介绍一些前端优化技巧,以 ......
339
0
0
2023-03-23
目录JSX介绍在 Vue3 中使用 JSX安装插件(@vitejs/plugin-vue-jsx)新建 jsx 文件语法补充知识:注意事项总结JSX介绍JSX(JavaScript 和 XML),是一个 HTML-in-JavaScript 的语法扩展,首先在 React 中被进入。JSX 可以很好地描述 UI 应该呈现出它应有交互的本质形式。JSX 是在 ......
802
0
0
2023-03-23
目录vis插件实现网络拓扑图安装引入visvis使用示例vis官方文档vis.js网络拓扑图点击折叠节点和展开节点首先看一下效果图vis插件实现网络拓扑图安装引入vis1.npm安装visnpm install vis 2.引入visimport { DataSet, Network } from 'vis'; vis使用示例methods:{ ......
802
0
0
2023-03-16
目录一、Options API(选项式API)的弊端1.1 什么是选项式API1.2 选项式API的弊端二、Composition API(组合式API)概述2.1 Composition API的作用2.2 Composition API的编码位置三、setup函数的参数和返回值3.1 setup函数的参数3.2 setup函数的返回值四、setup中如何 ......
367
0
0
2023-03-16