VuePress介绍 VuePress 由两部分组成:第一部分是一个极简静态网站生成器,它包含由 Vue 驱动的主题系统和插件 API,另一个部分是为书写技术文档而优化的默认主题,它的诞生初衷是为了支持 Vue 及其子项目的文档需求。 每一个由 VuePress 生成的页面都带有预渲染好的 HTML,也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时,一旦页面被加载,Vue 将接管这些静态内
转载
2024-04-04 19:39:49
53阅读
使用VuePress快速搭建博客最近我在3A平台购买了服务器,准备搭建一个博客。VuePress介绍VuePressVuePress官网https://www.vuepress.cnVuePress指南https://www.vuepress.cn/guide…VuePress安装安装前请安装 Node.jsNode.js下载地址http://www.nodejs.com.cn你可以在一个硬盘创建
转载
2024-06-18 14:05:11
80阅读
基本配置细节首页配置 首页配置文件是doc目录下的README.md文件,以下是一个如何使用的例子:---
home: true
heroImage: /hero.png
heroText: Hero 标题
tagline: Hero 副标题
actionText: 快速上手 →
actionLink: /zh/guide/
features:
- title: 简洁至上
detail
转载
2024-08-14 13:36:46
162阅读
1、插槽(1)插槽内容像 HTML 元素一样,我们常常需要给组件传递内容比如在下面的例子中,我们给自定义组件 prompt-info 传入 出错啦 的文本<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<script src="https://cdn.jsdeli
一、首先先建立文件main.vue,构建主体1.选择合适的模板element-plus,直接复制2.编写相应的样式<template>
<div class="main">
<el-container class="main-content">
<el-aside> aside </el-aside>
文章目录写在前面第一类:用来存放网站第二类:自定义 OSS对象存储 的图片路径 写在前面这里是小飞侠Pan?,立志成为一名优秀的前端程序媛!!!本篇博客收录于我的github前端笔记仓库中,持续更新中,欢迎star~? https://github.com/mengqiuleo/myNote因为自己的域名备案已通过,所以就想自己配置个二级域名。但是网上的教程都很分散,我自己踩坑了很多,花了很长时
之前在外卖软件上看到这个左右联动的效果,觉得很有意思,所以就尝试使用Vue来实现,将这个联动抽离成为一个单独的组件,废话少说,先来一张效果图。这个组件分为两个部分,1、左菜单;2、右菜单。动态数据结构menus: [ { name: '菜单1', data: [ { name: '1.1' }, { name: '1.2'
一. 内容简介vue首页页面二. 软件环境2.1 Visual Studio Code 1.75.02.2 chrome浏览器2.3 node v18.14.0三.主要流程3.1 搭建html结构3.2 添加css样式3.3 js代码3.4 页面展示四.具体步骤4.1 搭建html结构<template>
<div>
<!-- 轮播图 --&g
传统方式样式的添加在不使用Vue时,我们为一个Dom元素添加样式有两种方式:为Dom元素添加伪类class
使用style属性如下代码:<html>
<head>
<meta charset="utf-8">
</meta>
<title>vue样式使用</title>
<script
转载
2024-05-15 15:56:13
110阅读
21、主页:通过双层for循环渲染左侧菜单外层for循环用来渲染一级菜单,内层渲染for循环用来渲染二级菜单。在一级菜单里添加v-for指令,再提供唯一的key属性。key值有id就用id。<!-- 一级菜单 -->
<el-submenu
v-for="item in menulist"
:key="item.id"
>这时候出现了五个“导航栏一”,文本都是写死的
前言相信很多人都想拥有一个自己的个人博客,现有的个人博客搭建框架已经有很多了,例如 hexo 、vuepress 、jekyll 等等,这里我选用 vuepress 来快速搭建个人博客网上教程千千万,但总归都是零零散散的,没人会给你讲解得清清楚楚,所以我这里就手把手来讲解一下如何从零搭建这里先放上 vuepress 的官网链接:https://www.vuepress.cn/(opens new
转载
2024-10-26 18:48:01
242阅读
前言最近面试发现很多前端程序员都从来没有写过插件的经验,基本上都是网上百度。所以打算写一系列文章,手把手的教一些没有写过组件的兄弟们如何去写插件。效果展示先让大家看个效果展示,知道咱们要做的东西是个怎么样的样子,图片有点模糊,大家先将就点:开始制作DOM结构整体结构中应该存在两个容器:1. 菜单容器 2. 主页面容器;因此当前DOM结构如下:<template>
<div c
转载
2024-08-17 10:09:22
467阅读
前言Vue是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。准备阶段服务器准备推荐使用雨云作为服务器提供商,其是国内领先的云计算平台。使用优惠码 yhj 能获取优惠价格。开发环境配置在本地计算机上安装pnpm包管理器。安装
VuePress 由两部分组成:一部分是支持用 Vue 开发主题的极简静态网站生成器,另一个部分是为书写技术文档而优化的默认主题。它的诞生初衷是为了支持 Vue 及其子项目的文档需求。每一个由 VuePress 生成的页面都带有预渲染好的 HTML,也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时,一旦页面被加载,Vue 将接管这些静态内容,并将其转换成一个完整的单页应用(SPA),其他的
转载
2024-05-05 21:54:18
158阅读
原型:<el-input
style="width:200px"
size="small"
v-model="searchKeyword"
type="text"
@keydown.native="searchhandle"
placeholder=
转载
2024-10-20 06:42:25
41阅读
1、效果图,向上展示和向下展示 这是我将该组件作为子组件应用到父组件中使用的效果。同时子组件可以多次使用,子组件返回相应的数据 1、主要是通过控制 选项item 的 显示与隐藏 来实现搜索结果的。数据传递通过vue的父传子和子传父 2、子组件接收数组的时候,如果是
一个具有强大功能的 vuepress 主题仓库✨在vuepress或者vdoing主题项目中,其实已经内置了一些第三方插件,比如百度统计,第三方搜索,代码块一件复制,评论区等等。想看用了什么插件,看package.json就可以。以下是我的安装的一些依赖"devDependencies": {
"dayjs": "^1.9.7",
"inquirer": "^7.1.0",
转载
2024-08-20 14:21:39
218阅读
1.插件的分类1.添加全局方法或属性,如 vue-element 2.添加全局资源: 指令/过滤器/过渡等,如 vue-touch 3.通过全局mixin方法添加一些组件选项,如 vuex 4.添加Vue实例方法,通过把它们添加到 Vue.prototype 上实现vue插件的编写方法一般分为4类,主要注册和绑定机制如下:export default {
install(Vue, opti
Color界面的 大胆、图形化、有意义是Material Design的关键性原则之一在系统里大面积使用色块,用色块来展示主要内容和标题,让界面的主次感更佳突出调色板谷歌官方提供的调色板,共计20类基础色和16类强调色基础色按照饱和度划分为10个等级主色(Primary color)谷歌建议将饱和度500的基础色作为主色辅助色(Secondary color)颜色应该与主色调保持相似,即在主色调的
前言上一章已经讲了 vuepress 主题如何实现继承,这样我们可以任意修改默认主题的任何组件及样式了。我们知道 vuepress 是无法自动根据我们 markdown 文件中的---
tags:
- js
- vue
---
复制代码生成标签云的页面的,而一个博客,标签在其中有知识分类及导航功能,是必不可少的一环,下面带领大家来改造一下默认主题让它能支持自动生成标签云页面第一步配置的修改既然是主
转载
2024-08-06 19:06:25
57阅读