zl程序教程

vue 笔记一

  • [ Vue ] vue 设计原理之响应式系统实现笔记( 二 )

    [ Vue ] vue 设计原理之响应式系统实现笔记( 二 )

    调度执行执行调度的实质就是将更多的控制权交给用户,比方说在执行副作用函数的时候可以让用户特定的去处理一些方法,例如回顾上一节的代码执行一个自增同时输出 status 的方法:const data = { data: 'info', msg: ' ok ', status: 2 } let activeEffect; const eff

    日期 2023-06-12 10:48:40     
  • Vue学习笔记3-使用Vite安装项目

    Vue学习笔记3-使用Vite安装项目

    Vue学习笔记3-使用Vite安装项目一、ViteVite 是一个 web 开发构建工具,由于其原生 ES 模块导入方式,可以实现闪电般的冷服务器启动。通过在终端中运行以下命令,可以使用 Vite 快速构建 Vue 项目。使用 npm:# npm 6.x $ npm init vite@latest <project-name> --template vue # npm 7+,需要加

    日期 2023-06-12 10:48:40     
  • Vue学习笔记2-安装Vue

    Vue学习笔记2-安装Vue

    Vue学习笔记2-安装Vue一、安装Vue.js 设计的初衷就包括可以被渐进式地采用。这意味着它可以根据需求以多种方式集成到一个项目中。将 Vue.js 添加到项目中主要有四种方式:在页面上以 CDN 包的形式导入。 下载 JavaScript 文件并自行托管。 使用 npm 安装它。 使用官方的 CLI 来构建一个项目,它为现代前端工作流程提供了功能齐备的构建设置 (例如,热重载、保存时的

    日期 2023-06-12 10:48:40     
  • Vue笔记(2)

    Vue笔记(2)

    学习内容⊙动态绑定style样式 ⊙ 计算属性 ⊙ 事件监听 v-on⊙ v-on修饰符⊙ 条件判断不仅仅是可以动态绑定class,style样式也是可以动态绑定的动态绑定style 1.对象形式::style="{key(属性名), value(属性值)}" 试了一下,如果是像font-size这种中间有-连接的属性,需要使用驼峰法来

    日期 2023-06-12 10:48:40     
  • Vue笔记(9) 脚手架

    Vue笔记(9) 脚手架

    学习内容⊙ 脚手架的介绍⊙ 脚手架2.x的创建⊙ 脚手架3.x的创建⊙ 脚手架3修改配置文件脚手架的介绍安装: npm i -g @vue/cli安装完以后,如果我们还想用脚手架2功能,就要拉取2.x的模板 npm i -g@vue/cli -init vue脚手架2初始化项目: vue init webpack my-project 现在初始化一个2.x版本的项目 这时候会有很多选项要我

    日期 2023-06-12 10:48:40     
  • Vue学习笔记之moment.js日期处理控件

    Vue学习笔记之moment.js日期处理控件

    0x00 概述本文主要记录moment.js日期控件在vue中的使用;moment可以方便的计算自然月或者自然年份,避免使用固定天数或者月份计算导致结束日期错乱问题。0x01 安装moment插件npm install moment --save复制 在package.json中查看(moment插件安装成功)在Vue的JS部分导入momentimport moment from 'mo

    日期 2023-06-12 10:48:40     
  • Vue.js 学习笔记 - 组件(Components)

    Vue.js 学习笔记 - 组件(Components)

    Vue 组件注册Components 要确保在初始化根实例 之前 注册了组件全局注册:Vue.component('my-component', { template: '<div>A custom component!</div>' }) // 创建根实例 new Vue({ el: '#example'

    日期 2023-06-12 10:48:40     
  • Vue-travel学习笔记

    Vue-travel学习笔记

    vue去哪网跟学笔记记录学习点滴1. 初始化项目1.1 手机显示配适minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" 阻止用户手滑发大缩小页面1.2 初始化样式 –>引入reset.css1.3 移动端多倍屏边框不准的问题 –> 引入 border.css1.4 解决click延迟300ms的问题 –> 引入 f

    日期 2023-06-12 10:48:40     
  • Vue学习笔记(一)

    Vue学习笔记(一)

    Vue 学习笔记(一)1. vue 简介Vue 是一套用于构建用户界面的前端框架1.1 vue 的两个特性数据驱动视图 使用了 vue 的页面,vue 会监听数据的变化,自动重新渲染页面的结构数据驱动视图是单向的数据绑定,即只能由数据来影响页面结构双向数据绑定 填写表单时,双向数据绑定可以让开发者在不操作 DOM 的前提下,自动把用户填写的内容同步到数据源中 1.2 MVVMvue 实现数据

    日期 2023-06-12 10:48:40     
  • Vue开发、学习笔记,持续记录

    Vue开发、学习笔记,持续记录

    Vue每天学一些,慢慢的也学下来了。记一些笔记生命周期图:https://nicen.cn/collect/life.pngVue-Router学习:https://nicen.cn/vue-router.html开始Vue官网: https://vuex.vuejs.org/zh/基于Vue的各种UI库 Vuetify :https://vuetifyjs.com/zh-HansElement-

    日期 2023-06-12 10:48:40     
  • Vue-Router学习笔记,持续记录

    Vue-Router学习笔记,持续记录

    前端路由1. hash 模式随着 ajax 的流行,异步数据请求交互运行在不刷新浏览器的情况下进行。而异步交互体验的更高级版本就是 SPA —— 单页应用。单页应用不仅仅是在页面交互是无刷新的,连页面跳转都是无刷新的,为了实现单页应用,所以就有了前端路由。 类似于服务端路由,前端路由实现起来其实也很简单,就是匹配不同的 url 路径,进行解析,然后动态的渲染出区域 html 内容。但是这样存在一

    日期 2023-06-12 10:48:40     
  • Vuex3.x、Vuex4.x状态管理器学习笔记

    Vuex3.x、Vuex4.x状态管理器学习笔记

    Vuex:https://v3.vuex.vuejs.org/zh什么是状态管理器?方便调试,方便维护数据。https://vuex.vuejs.org/zh/#%E4%BB%80%E4%B9%88%E6%98%AF%E2%80%9C%E7%8A%B6%E6%80%81%E7%AE%A1%E7%90%86%E6%A8%A1%E5%BC%8F%E2%80%9D%EF%BC%9FVuex使用记录1.在

    日期 2023-06-12 10:48:40     
  • vue笔记

    vue笔记

    此处是 vue开发学习笔记目录-vue官网open in new window-1.传统的网页开发方式的弊端-2.第一个vue3.x应用-3.methods、computed、watch:区别-4.vue-行内样式和动态class-5.vue指令认识-6.vue单文件应用-7.Vue单文件应用续

    日期 2023-06-12 10:48:40     
  • golang + vue3+vite 构建后台管理系统笔记。

    golang + vue3+vite 构建后台管理系统笔记。

    开始选用的gin框架,但是后来突然发现gin框架的路由不是最长匹配规则。不能实现路由降级。比如不能同时注册 / 和 /upload 路由。如下代码会报错。// catch-all wildcard '*filepath' in new path '/*filepath' conflicts r.GET("/ping", func

    日期 2023-06-12 10:48:40     
  • Vue.js学习笔记

    Vue.js学习笔记

    在执行 npm run dev 命令的时候出现8080端口被占用# 根据端口号,查找被占用端口的进程 id netstat -nao|findstr "8080" # 结束进程,2228 为进程 id taskkill /pid 2228 /F复制使用v-for指令遍历组件时产生警告,提示需要在组件上增加一个key属性当使用v-for指令遍历组件时,需要在组件上添加一个key

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue3配置axios跨域

    Vue笔记:Vue3配置axios跨域

      实现跨域共3个步骤: 1,vue3.0根目录下创建vue.config.js文件; module.exports = { devServer: { proxy: { '/api': { target: 'https://you.163.com/', //接口域名 c

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue中使用mockjs

    Vue笔记:Vue中使用mockjs

      前言   前后端分离的开发模式,前端需要向后端请求数据(ajax请求),但实际开发过程中,前后端会约定一份接口文档,但前后端开发进度并不一致,当后端没有完善接口功能时,前端需要在本地模拟数据返回,此时需要使用到mockjs。 安装 npm install mockjs --save-dev 目录结构    配置 1、api下的config.js:配置axi

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue制作个人简历并使用Nginx部署

    Vue笔记:Vue制作个人简历并使用Nginx部署

      一、实现效果 项目使用Vue3+ElementUI+BootStarp Github地址:https://github.com/Angell1/CV 测试页面:http://123.207.251.121:8888/ 环境:     部署 1、Vue打包 npm run build 注意:我使用vue3,所以自定义配置文件: module.export

    日期 2023-06-12 10:48:40     
  • Vue笔记:Vue小练习

    Vue笔记:Vue小练习

        div切换 <template> <div id="app"> <div class="tab-tit"> <!--点击设置curId的值 如果curId等于0,第一个a添加cur类名,如果curId等于1,第二个a添加cur类名,以此类推。添加了cur类名,a就会改变样式 @clic

    日期 2023-06-12 10:48:40     
  • Vue笔记:vue项目引入bootstrap、elementUI、echarts

    Vue笔记:vue项目引入bootstrap、elementUI、echarts

      引入bootstrap 安装依赖包 cnpm install bootstrap --save-dev cnpm install jquery --save-dev cnpm install popper.js --save-dev 全局引入在项目中根目录下的main.js中添加如下代码: import 'bootstrap' import $ from 'jqu

    日期 2023-06-12 10:48:40     
  • Vue笔记:安装配置node.js及使用vue-cli创建项目

    Vue笔记:安装配置node.js及使用vue-cli创建项目

      Node.js安装配置 安装配置教程:https://www.cnblogs.com/aizai846/p/11441693.html 注意:使用npm下载包的时候配置代理 临时使用淘宝镜像 npm --registry https://registry.npm.taobao.org install -global 包名 永久配置淘宝镜像 npm install -globa

    日期 2023-06-12 10:48:40     
  • 【收藏】vuejs学习笔记github地址

    【收藏】vuejs学习笔记github地址

    https://github.com/GoogTech/YUbuntu0109.github.io

    日期 2023-06-12 10:48:40     
  • vue-router路由的安装、配置、具体用法和Vue-router学习笔记

    vue-router路由的安装、配置、具体用法和Vue-router学习笔记

    官网: 安装 | Vue RouterVue.js 的官方路由https://router.vuejs.org/zh/installation.html#直接下载-cdn vue-router的基本用法 具体步骤: 安装vue-router npm install vue-router --save-dev

    日期 2023-06-12 10:48:40     
  • 【vuejs】2/5vue学习笔记

    【vuejs】2/5vue学习笔记

        ### 准备开始 ------ #### 学员反馈 凃凃老师, 该拓展的一定要拓展, 即使有部分同学跟起来吃力 , 以后工作很可能在项目中遇到相似问题, 至少知道老师讲过 , 有对照也好解决. 可以说清楚有哪些必须掌握, 有哪些让有余力的同学掌握. #### 复习 - vue单文件方式 xxx.vue - 1:准备好配置文件 pack

    日期 2023-06-12 10:48:40     
  • vue读书笔记

    vue读书笔记

    vue提供了计算属性,在计算属性里可以进行各种运算,创建Computed.vue <template> <div id="computed-basics

    日期 2023-06-12 10:48:40     
  • vue学习笔记

    vue学习笔记

    如果属性的值是html的代码,要想让代码解释为标签而不是原样输出,需要使用v-html指令,创建RenderHtmlApp.vue组件 <template> &

    日期 2023-06-12 10:48:40     
  • Vue3学习笔记(四)——组件、插槽、生命周期、Hooks

    Vue3学习笔记(四)——组件、插槽、生命周期、Hooks

    一、组件 如果我们将一个页面中所有的处理逻辑全部放在一起,处理起来就会变得非常复杂,而且不利于后续的管理以及扩展,但如果,我们将一个页面拆分成一个个小的功能块,每个功能块完成属于自己这部分独立的功能,那么之后整个页面的管理和维护就变得非常容易了。如果我们将一个个功能块拆分后,就可以像搭建积木一下来搭建我们的项目。   1.0、SPA SPA指的是Single Page Appli

    日期 2023-06-12 10:48:40     
  • 测试开发之Vue学习笔记-Vue路由

    测试开发之Vue学习笔记-Vue路由

    Vue路由 18. Vue-路由基础 安装 cnpm install --save vue-router 官方文档:https://router.vuejs.org/zh/ src/main.js中 (1)引入VueRouter:import VueRouter from &

    日期 2023-06-12 10:48:40     
  • Vue八股文笔记自用1

    Vue八股文笔记自用1

    使用 Object.defineProperty() 来进行数据劫持有什么缺点? 在对对象添加属性或者通过下标方式修改数组时,Object.defineproperty无法监测到,V

    日期 2023-06-12 10:48:40     
  • Vue学习笔记——vuex

    Vue学习笔记——vuex

    5.1.理解vuex 5.1.1.vuex是什么 概念:专门在Vue中实现集中式状态(数据)管理的一个Vue插件,对vue应用中多个组件的共享状态进行集中式的管理&

    日期 2023-06-12 10:48:40     
  • Vue学习笔记——Vue中的ajax

    Vue学习笔记——Vue中的ajax

    4.1. 解决开发环境Ajax跨域问题 使用代理服务器 4.2.github用户搜索案例 4.2.1.效果 4.2.2接口地址 https://api.github.com/search/users?q=

    日期 2023-06-12 10:48:40