当前位置：首页 > news >正文

Vue以及整合ElementUI

news 2026/2/3 2:38:58

初始化vue项目

#vue 脚手架使用 webpack 模板初始化一个 appname 项目
vue init webpack `appname`

启动 vue 项目

#项目的 package.json 中有 scripts，代表我们能运行的命令
npm start = npm run dev #启动项目
npm run build：将项目打包

项目结构

在这里插入图片描述

运行流程

在这里插入图片描述

编写一个自己的视图

在这里插入图片描述

做一个跳转效果

https://router.vuejs.org/zh/guide/

在这里插入图片描述

整合ElementUI

安装参考官网

https://element.eleme.cn/#/zh-CN/component/installation

npm install element-ui -S

在这里插入图片描述

使用一个页面布局并实现一个小需求

https://element.eleme.cn/#/zh-CN/component/container

在这里插入图片描述

复制官网提供的代码到App.vue中,将里的内容替换为路由视图

在这里插入图片描述

编写新的视图并加入到index.js里

在这里插入图片描述
根据官网https://element.eleme.cn/#/zh-CN/component/menu

在这里插入图片描述
的提示 NavMenu 导航菜单可以点击进行页面跳转 router属性默认是false的，我们将它改为true。并且index且为路由地址

效果实现

Vue以及整合ElementUI

初始化vue项目 #vue 脚手架使用 webpack 模板初始化一个 appname 项目 vue init webpack appname启动 vue 项目 #项目的 package.json 中有 scripts，代表我们能运行的命令 npm start npm run dev #启动项目 npm run build：将项目打包项目结构运行流程…...

编程日记 2023/10/2 14:55:04

免费、丰富、便捷的资源论坛——Yiove论坛，包括但不限于阿里云盘、夸克云盘、迅雷云盘等等

引言目前资源的数量达到了60000，六万多的资源意味着在这里几乎可以找到任何你想要的资源。当然，资源并不是论坛的全部，其中还包括了技术交流、福利分享、最新资讯等等。传送门：YiOVE论坛 - 一个有资源有交流，有一…...

编程日记 2023/10/2 14:53:02

1.3 互联网的组成

思维导图： 前言： 我的笔记： #### 一、总览 - **互联网的结构**： - 具有全球覆盖和复杂的拓扑结构。 - 即便结构复杂，还是可以从工作方式上简化为两大部分：边缘部分和核心部分。 #### 二、边缘部分 -…...

编程日记 2023/10/2 14:49:59

【机器学习】熵和概率分布，图像生成中的量化评估IS与FID

详解机器学习中的熵、条件熵、相对熵、交叉熵图像生成中常用的量化评估指标通常有Inception Score (IS)和Frchet Inception Distance (FID) Inception Score (IS) 与 Frchet Inception Distance (FID) GAN的量化评估方法——IS和FID，及其pytorch代码...

编程日记 2023/10/2 14:46:57

Vue3.0跨端Web SDK访问微信小程序云储存，文件上传路径不存在/文件受损无法显示问题（已解决）

整理需求： 需要vue3.0作为pc端的后台管理来连接微信小程序客户端需要Web SDK的引入，实现vue3.0接入云开发环境需要以云环境作为线上服务器，将vue3.0上传的本地文件通过云环境进入云储存，并将文件在云端生成云端快捷访问路径及htt…...

编程日记 2023/10/2 14:44:55

function calculateDaysDifference(targetDateString) {const currentDate new Date();const targetDate new Date(targetDateString);// 计算毫秒差异const timeDifference targetDate - currentDate;// 计算天数差异，如果结果为负数，则设置为0const…...

编程日记 2023/10/2 14:43:54

BUUCTF reverse wp 76 - 80

[CISCN2018]2ex 四处游走寻找关键代码 int __fastcall sub_400430(int a1, unsigned int a2, int a3) {unsigned int v3; // $v0int v4; // $v0int v5; // $v0int v6; // $v0unsigned int i; // [sp8h] [8h]unsigned int v9; // [sp8h] [8h]int v10; // [spCh] [Ch]v10 0;for…...

编程日记 2023/10/2 14:42:53

科技资讯|AirPods Pro基于定位控制的自适应音频功能

在接受 TechCrunch 媒体采访时，苹果高管 Ron Huang 和 Eric Treski 谈到了关于 AirPods Pro 自适应音频（Adaptive Audio）功能的轶事，曾考虑基于 GPS 信号来控制自适应音频级别。 Treski 表示在探索自适应音频功能初期&#xff0…...

编程日记 2023/10/2 14:41:52

《Jetpack Compose从入门到实战》第九章 Accompanist 与第三方组件库

目录 AccompanistSystemUiControllerPagerSwipeRefreshFlow LayoutInsets LottieCoilAsyncImageSubcomposeAsyncImageAsyncImagePainter Accompanist 最新可用版本accompanist官方文档 SystemUiController 依赖：implementation “com.google.accompanist:accompa…...

编程日记 2023/10/2 14:40:51

Centos7 docker 容器内root身份应用自启动 /usr/sbin/init 问题

Centos7 docker 容器内root身份应用自启动 & /usr/sbin/init 问题环境：我在一个 docker 容器内手动安装了 mysql、nginx、autotestsystem（自己的服务）； mysql 和 nginx 都做了服务脚本：mysqld.service、nginx.se…...

编程日记 2023/10/2 14:38:50

STL学习笔记之容器

首先我们要学习的是容器第一个是容器的初始化（构造方式）有三种方式分别是第一种 int arr[]{1,2,3} vector<int> v1(arr,arr3) 即容器存放的种类和从另外一个数组去拷贝一段数据。第二种 vector<int> v2(3,10); 第一个3是指存放…...

编程日记 2023/10/2 14:36:48

Java基础---第十二篇

系列文章目录文章目录系列文章目录一、获取一个类Class对象的方式有哪些？二、ArrayList 和 LinkedList 的区别有哪些？三、用过 ArrayList 吗？说一下它有什么特点？一、获取一个类Class对象的方式有哪些？搞清楚类对象和实例对象，但都是对象。第一种：通过类对象的 get…...

编程日记 2023/10/2 14:32:45

Acwing 841. 字符串哈希

Acwing 841. 字符串哈希题目描述思路讲解代码展示题目描述思路讲解代码展示 #include <iostream> #include <algorithm>using namespace std;typedef unsigned long long ULL;const int N 100010, P 131; // P 131 或者13331(经验值)int n, m; char str[N]…...

编程日记 2023/10/2 14:31:44

NEON优化：性能优化经验总结

NEON优化：性能优化经验总结 1. 什么是 NEONArm Adv SIMD 历史 2. 寄存器3. NEON 命名方式4. 优化技巧5. 优化 NEON 代码(Armv7-A内容，但区别不大)5.1 优化 NEON 汇编代码5.1.1 Cortex-A 处理器之间的 NEON 管道差异5.1.2 内存访问优化 Reference: NEON优…...

编程日记 2023/10/2 14:29:43

C++ 并发编程实战第九章

目录 9.1 线程池 9.1.1 最简易可行的线程池 9.1.2 等待提交给线程池的任务完成运行 9.1.3等待其他任务完成的任务 9.1.4 避免任务队列上的争夺 9.1.5 任务窃取 9.2 中断线程 9.2.1 发起一个线程，以及把他中断 9.2.2 检测线程是否被中断 9.2.3 中断条件变…...

编程日记 2023/10/2 14:28:42

【Java】super 关键字用法

目录 this与super区别 1.访问成员变量-示例代码继承中构造方法的访问特点 2.访问构造方法-示例代码： 继承中成员方法访问特点 3.访问成员方法-示例代码： super 关键字的用法和 this 关键字相似 this : 代表本类对象的引用super : 代表父类存储空间…...

编程日记 2023/10/2 14:25:39

前端笔试题总结，带答案和解析

1. 执行以下程序，输出结果为（） var x 10; var y 20; var z x < y ? x:y; console.log(xx;yy;zz);A x11;y21;z11 B x11;y20;z10 C x11;y21;z10 D x11;y20;z11 初始化x的值为10，y的值为20，x < y返回结果为tru…...

编程日记 2023/10/2 14:21:34

Omniverse Machinima

Omniverse Machinima App | NVIDIA Omniverse Machinima 是 NVIDIA 推出的一款实时动画创作工具，可用于在虚拟世界中制作和操纵角色及其环境。该工具使用 Universal Scene Description (USD) 作为其通用场景描述格式，可与多种 3D 建模、动画和渲染应用程…...

编程日记 2023/10/2 14:19:32

【测试人生】游戏业务测试落地精准测试专项的一些思路

精准测试在互联网领域有广泛的应用。以变更为出发点，通过对变更内容进行分析，可以确定单次变更具体涉及到哪些模块和功能点，以及是否存在夹带风险，从而从QA的视角，可以知道哪些功能模块需要做测试，以及哪些…...

编程日记 2023/10/2 14:17:30

Redis 数据类型底层原理

String 内部编码有三种：int、embstr、raw int：如果一个字符串对象保存的是整数值，并且这个整数值可以用 long类型来表示(不超过 long 的表示范围，如果超过了 long 的表示范围，那么按照存储字符串的编码来存储&#xf…...

编程日记 2023/10/2 14:14:27

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能，包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

编程新知 2025/11/14 9:31:35

解决Ubuntu22.04 VMware失败的问题 ubuntu入门之二十八

现象1 打开VMware失败 Ubuntu升级之后打开VMware上报需要安装vmmon和vmnet，点击确认后如下提示最终上报fail 解决方法内核升级导致，需要在新内核下重新下载编译安装查看版本 $ vmware -v VMware Workstation 17.5.1 build-23298084$ lsb_release…...

编程新知 2026/1/24 10:07:40

基于服务器使用 apt 安装、配置 Nginx

🧾 一、查看可安装的 Nginx 版本首先，你可以运行以下命令查看可用版本： apt-cache madison nginx-core输出示例： nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...

编程新知 2026/1/9 12:53:59

ESP32读取DHT11温湿度数据

芯片：ESP32 环境：Arduino 一、安装DHT11传感器库红框的库，别安装错了二、代码注意，DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

编程新知 2026/1/30 8:46:45

学校招生小程序源码介绍

基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码，专为学校招生场景量身打造，功能实用且操作便捷。从技术架构来看，ThinkPHP提供稳定可靠的后台服务，FastAdmin加速开发流程，UniApp则保障小程序在多端有良好的兼…...

编程新知 2026/1/26 14:19:52

Python如何给视频添加音频和字幕

在Python中，给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加，包括必要的代码示例和详细解释。环境准备在开始之前，需要安装以下Python库：…...

编程新知 2025/9/3 4:12:17

【HarmonyOS 5 开发速记】如何获取用户信息（头像/昵称/手机号）

1.获取 authorizationCode： 2.利用 authorizationCode 获取 accessToken：文档中心 3.获取手机：文档中心 4.获取昵称头像：文档中心首先创建 request 若要获取手机号，scope必填 phone，permissions 必填 …...

编程新知 2025/9/17 2:39:21

Java + Spring Boot + Mybatis 实现批量插入

在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法：使用 MyBatis 的 <foreach> 标签和批处理模式（ExecutorType.BATCH）。方法一：使用 XML 的 <foreach> 标签&#xff…...

编程新知 2025/6/11 2:44:05

LLMs 系列实操科普（1）

写在前面： 本期内容我们继续 Andrej Karpathy 的《How I use LLMs》讲座内容，原视频时长 ~130 分钟，以实操演示主流的一些 LLMs 的使用，由于涉及到实操，实际上并不适合以文字整理，但还是决定尽量整理一份笔…...

编程新知 2026/1/31 11:35:24

第7篇：中间件全链路监控与 SQL 性能分析实践

7.1 章节导读在构建数据库中间件的过程中，可观测性和性能分析是保障系统稳定性与可维护性的核心能力。特别是在复杂分布式场景中，必须做到： 🔍 追踪每一条 SQL 的生命周期（从入口到数据库执行）&#…...

编程新知 2025/12/11 0:27:15

初始化vue项目

启动 vue 项目

项目结构

运行流程

编写一个自己的视图

做一个跳转效果

整合ElementUI

安装参考官网

使用一个页面布局并实现一个小需求

相关文章：