vue
文章平均质量分 81
vue 相关知识点的总结
vimin_M
主要学习前端相关技术,掌握html,css,JavaScript的使用;熟悉vue框架,了解git流程;熟悉nodejs,能搭建简易的服务器以及编写对应的api接口;熟悉mysql的基础操作命令
展开
-
vue 组件通信的几种方式
$refs$parent / $children$provide / $inject$attrs / $listener原创 2021-06-30 17:25:53 · 613 阅读 · 1 评论 -
vue 构建 SSR 服务端渲染 — 简单的服务端渲染
vue 构建 SSR 服务端渲染 — 简单的服务端渲染简单的服务端渲染基础的服务端渲染需要安装几个比较重要的模块npm i vue vue-server-renderer express在根路径下创建文件 server.js简易的服务端首先需要构建一个简易的服务器,因为是服务端渲染,所以需要在服务端返回 html 代码// server.jsconst server = require('express')()// 当浏览器请求该地址时返回信息server.get('/', (req,原创 2021-06-03 18:05:10 · 154 阅读 · 0 评论 -
Vue 数据响应式原理
Vue 数据响应式原理Vue2 中的数据响应式原理用的是观察者模式,下面用一张流程图来简单说明一下观察者模式的原理。从流程图不难看出,观察者模式的核心就是 Dep 和 Watcher 这两个对象。Dep 负责收集依赖(这里的依赖实际就是 watcher),并在监听到数据变化的时候发送通知。发送通知的过程实际就是调用 watcher.update() 方法。从而更新视图内容。下面我们来详细看看 Vue 具体是如何实现数据响应式的。我将 Vue 实现数据响应式的过程分为三步:创建响应式数据,也就是原创 2021-06-02 11:37:19 · 709 阅读 · 0 评论 -
nuxt的基础使用
nuxt的基础使用安装第一个页面启动项目pages 目录路由导航nuxt-link编程式导航动态路由nuxt 是用于解决 vue 服务端渲染+客户端渲染(同构渲染)的方法,他的内部集成了 vue、vue-router 等模块,可以让开发更加的方便安装新建一个文件夹,并移动到当前目录中初始化项目 npm init -ynuxt 的安装非常的简单,只需要安装 nuxt 模块即可npm i nuxt第一个页面创建好项目和安装模块后,在项目根路径下创建 pages 目录,该目录将存放项目的所有页面原创 2021-05-18 23:43:49 · 3393 阅读 · 3 评论 -
模拟 vue-router hash 模式的基础功能实现
模拟 vue-router hash 模式的基础功能实现模拟 vue-router 的实现实现 vue-router 的核心步骤构建类构建响应式数据属性 currentinstall方法初始化 router-link,router-view 组件match 匹配路由监听 hash 改变模拟 vue-router 的实现以下内容基于 vue-router hash 模式来实现实现 vue-router 的核心步骤构建 vue-router 类构建响应式数据属性 current,动态渲染 dom添原创 2021-04-13 17:37:22 · 280 阅读 · 0 评论 -
发布/订阅模式
发布/订阅模式发布/订阅模式基础原理事件中心subs订阅事件方法 $on发布事件 $emit发布/订阅模式基础原理发布/订阅模式是响应式的解决办法之一,先看下图:可以看到,所有的事件其实是由事件中心管理。我们可以订阅事件中心的任意事件,并且传递事件触发函数(也就是我们订阅的事件被触发后希望执行的函数)。当某个事件被发布的时候,事件中心就会触发该事件所有的事件触发函数,从而实现响应式。不难看出,发布/订阅模式的组成部分主要有:事件中心 eventCenter订阅事件 $on发布事件 $emi原创 2021-04-08 10:25:41 · 795 阅读 · 0 评论