浅入深出Vue系列文章 之前大部分是在做后端,后来出于某些原因开始接触Vue.深感前端变化之大,各种工具.框架令人眼花缭乱.不过正是这些变化,让前端开发更灵活. 博主在刚开始时,参考官网的各个步骤以及网上的博客.搭个环境,跑起来demo都费了大半天的劲. 本系列文章的初衷: 迅速的搭建起环境,不在环境.工具等其他因素上占用太多时间 Vue框架由浅入深的理解部分知识点,能快速上手Vue并将其实践至项目中 由粗糙到精致,一步步优化代码,了解并使用一部分关于代码整洁.优化的知识 同时也是若羽对所学知识…

浅入深出Vue:环境搭建 工欲善其事必先利其器,该搭建我们的环境了. 安装NPM 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的NodeJS Windows安装程序 下载下来后,直接Next 这里同样的,有固态硬盘的童鞋可以安装到固态硬盘,不过这里有个小问题就是 在选择目录的时候会卡死一小会儿.可能是若羽的机器性能不太好. 接下来一路下一步即可,坐等安装 安装完成,让我们命令行测测看 win键 + R呼出运行,输入cmd确定即可 输入node -v,查看nodejs的版本.若…

浅入深出Vue之工具准备(二):PostMan安装配置 由于家中有事,文章没顾得上.在此说声抱歉,这是工具准备的最后一章. 接下来就是开始环境搭建了~尽情期待 工欲善其事必先利其器,让我们先做好准备工作吧 导航篇 PostMan安装 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的PostMan 直接点开安装包后,自动安装上去了(这有点流氓啊) 若羽这里就直接登录了,没有梯子或者不想注册的可以直接点最下面的Skip xxxx跳过 PostMan配置Mock服务 PostMan除…

浅入深出Vue之工具准备(一):WebStorm安装配置 工欲善其事必先利其器,让我们先做好准备工作吧 导航篇 WebStorm安装配置 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的WebStorm 安装 下载后即可食用,此步骤与正常软件安装并无二样. 若有固态硬盘,尽可能安装在固态硬盘上,物理加速一下~ 按照自己的系统来勾选32位还是64位,若羽的机器装的是64位系统,因此勾选的是64位.另外为了防止本机没有JetBrains系列所需的JRE环境,建议直接勾选即可. 接下…

浅入深出Vue导航 导航帖,直接点击标题即可. 文中所有涉及到的资源链接均在最下方列举出来了. 前言 基础篇 浅入深出Vue:工具准备之WebStorm搭建及配置 浅入深出Vue之工具准备(二):PostMan安装配置 浅入深出Vue:环境搭建 相关资源 WebStorm NodeJS npm淘宝镜像 Vue…

今天正式开始入门篇,也就是实战了~ 首先我们是要做一个博客网站,UI 框架采用江湖传闻中的 ElementUI,今天我们就来利用它确定我们博客网站的基本布局吧. 准备工作 新建一个vue项目(可以参考基础篇里的搭建方法,也可以参考官网现在最近的 Vue CLI 3.x进行可视化创建和管理 安装 vue-router 安装 elementui 以上的操作都可以在之前的博文中(基础篇)找到完整步骤,这里就不重复了. 我们做完准备工作之后,目录结构如下: 我们来看看这个目录: |--public 公共…

深入浅出vue系列文章已经更新过半了,在入门篇中我们实践了一个小小的项目. <代码整洁之道>一书中提到过一句话: 神在细节中 这句话来自20世纪中期注明现代建筑大师 路德维希·密斯·范·德·罗所说,他秉承的是少即是多的建筑设计哲学,玻璃幕墙等现代建筑结构便是由他缔造的. 而这句话也对软件开发领域产生了不小的影响,同时在软件开发领域中,很多概念都是源于其它行业,经典的便有现在所提到的建筑学. 在实际开发中,当然也是需要注意细节的.很多人可能都碰到过 "维护不下去" 的代码,或…

终于到我们小项目的最后一个功能了,那就是列表页展示! 新建组件 先来新建组件 List.vue: <template> <div></div> </template> <script> export default { name: "List" } </script> <style scoped> </style> 然后添加对应的路由对象: { path: '/list', name: 'l…

上一篇我们使用了简单的数据渲染,那么如果说我们想要动态渲染标签的 class 可以这么操作么? 为什么绑定 简单的数据渲染,包括表达式.函数在内.其实都只是在标签中渲染,如果遇到以下情况怎么办呢: 需要在标签内部进行某种 "骚操作" . 需要控制流来控制不同数据下的不同渲染效果. 需要渲染一个数组. 这时候简单渲染就不能很好的解决问题了,怎么办 ? 来一发数据绑定吧! 绑定是什么 在了解绑定是什么之前,先了解一下什么是指令: 在 " vue" 中,指令是带有 v-…

在软件开发的过程中,"自动化"这个词出现的频率是比较高的.自动化测试,自动化数据映射以及各式的代码生成器.这些词语的背后,也说明了在软件开发的过程中,对于那些重复.千篇一律的事情.人们总是想让它自己完成,来解放我们的双手. "懒惰"是进步的动力 为什么要自动化路由 路由自动化在于解决以下的问题: 每次新建页面时的重复操作:在路由文件中添加对应的路由对象. 路由与代码耦合:路由依赖于路由对象的硬编码,当某一路由发生变动时,势必需要修改对应的路由对象.当路由层级.路径发…

在开始本篇的主题之前,让我们把上次遗留下来的问题都清理一下: 将其他组件中 axios 请求的地方封装起来. 这里就不把代码放在开头了,相关代码都放在文末,有兴趣了解的童鞋可以先往下翻. 好了, 我们现在把上篇剩下的任务给完成了,接下来我们来正式开始本篇内容吧. 去重是什么 字面上意思:去除重复,在项目中,不可避免的会出现重复代码.但是如果不好好去处理这些重复代码,那很有可能就会给你很多"惊喜". 如何为"重复" 下一个定义呢? 从最浅显的层次来看, 相同即是重复.…

今天来正式开始 vue的学习,首当其冲的当然是数据的渲染.毕竟数据就是拿来看的,看看如果使用 vue来展示数据. 为什么渲染 俗话说 "人靠衣装马靠鞍", 那咱们的代码就是得靠 UI 来展现了.实现的代码规不规范,表不标准那是后话.但必须要好看~(开个玩笑,代码同样要注意整洁与优雅噢) 数据无论放在后台.数据库还是缓存,对于用户而言都不知情.用户能够感受到的,就是 UI,因此我们的数据是需要渲染在页面上显示出来给用户看的. 题外话:很久之前,老师就经常提起一句话,文不如字,字不如表,表…

上一篇的最后留下了一个 v-on的思考,也就是本章的主题:事件处理 为什么需要事件处理 在前端开发中,经常要面对各种表单.按钮.而这里面就住着一个事件:点击 (click). 前端童鞋们肯定不陌生它,因为经常会出现.比如说: 表单提交 各式各样的按钮 列表多级菜单折叠 v-on支持监听原生的 DOM事件,也就是 vue中也支持以前纯js写法中各式各样的时间,只是在 vue中换了一种写法. 使用事件处理的好处便在于我们可以通过事件来控制数据. MVVM中强调的一点便是数据驱动,那么在 vue中如果…

组件在 vue开发中是必不可少的一环,用好组件这把屠龙刀,就能解决不少问题. 组件是什么 官方的定义: 组件是可复用的 Vue 实例,并且可带有一个名字. 官方的定义已经非常简明了,组件就是一个实例. 如何使用组件 在具体编写组件实例代码前,我们先来如下几个约定: 所有组件基于单文件组件,即一个 .vue文件就是一个组件 data 必须为一个函数 template 节点下只能有一个子节点 约束不多,但最后两个需要牢记在心. 基于单文件组件的前提下,一个组件的基本构造如下: <template>…

上一篇了解了组件的概念及在使用中需要注意的地方.在面对单个组件逻辑复杂需要拆分时,难免会遇到父子组件之间数据传递的问题.那么我们来了解一下在父子组件之间进行数据传递时需要遵循哪些约定,以及要注意哪些问题. 如何传递 父组件向子组件在进行传递时,使用的是 prop特性进行传递. 约定 老规矩, 在使用前我们首先了解应该怎么使用,有哪些约束条件: 子组件的 props中定义要传递的变量名 变量名同组件的命名规范 父组件传值时,需要使用短横线分隔命名 使用 v-bind进行传值 定义 首先在子组件中定…

上一篇我们实现了注册功能,现在我们来实现一下登录功能. 准备工作 新建登录组件 添加登录组件的路由对象 新建登录组件 Login.vue: <template> <div> </div> </template> <script> export default { name: "Login" } </script> <style scoped> </style> 添加路由对象: { path:…

路由的概念在计算机界中的历史大概可以追溯到OSI模型中的数据链路层与网络层中的定义.这里的定义大意是:在转发数据包时,根据数据包的目的地址进行寻址,从而将数据包发往指定的目的地. 在 Web开发中同样存在着路由的概念,在各式各样的前端 mvvm框架出来之前,普遍存在于后端.通俗的说法也就是 [module/]controller/action的组合,将 url映射到指定的 action中处理.现在在前端中同样存在着路由这一概念. 为什么需要路由 在以往的前端开发中,通常没有路由这一概念,这样就造…

基本布局已经有了, 现在我们来开始做我们的注册页面~ 当然需要注册才能发表文章啊(糟老头子坏得很, 我可以只有我一个人能发啊). 这里我们设定只有注册才能发表文章,也就淡化了管理员这个概念.在开发中先将原型做出来,然后再对其进行迭代.重构来达到我们最终想要的效果. 准备 新建 vue 组件,编写注册页面的代码 为这个组件建立路由对象 这里我们依旧是采用 ElementUI 中的组件,因为是注册,需要提交表单. 因此我们来看看 ElementUI 中表单组件相关的文档: 官方文档:点击查看 实现登…

项目完成之后,当然不能满足于在我们的开发环境下跑一跑.我们可以打包发布到服务器上,让大家一起来欣赏一下你的作品. 那么 vue 项目如何打包发布呢,新建的项目目录下通常都有一个 README.md 的文件,里面就描述了发布的步骤: 下面这个是 vue-cli 3.x 创建的项目中的 README.md 文件内容: # firstpage ## Project setup npm install ### Compiles and hot-reloads for development npm ru…

登录与注册功能都已经实现,现在是时候来开发文章编辑功能了. 这里咱们就使用 markdown 作为编辑语言吧,简洁通用.那么我们就需要找一下 markdown 的编辑器组件了,而且还要支持 vue噢. 若羽这里找到的一个是 mavonEditor,在 github 上有2k+ 的 star.文档也都是中文的,比较友好. mavonEditor地址 添加组件 && 新建编辑组件 首先来安装一下编辑器: npm install mavon-editor --save 然后在 main.js 中…

Java中的集合框架(上) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,如果已经有java基础的小伙伴可以直接跳到<浅入深出之Java集合框架(下)>. 目录: 浅入深出之Java集合框架(上) 浅入深出之Java集合框架(中)   努力赶制中..关注后更新会提醒哦! 浅入深出之Java集合框架(下) 努力赶制中..关注后更新会提醒哦! 一.集合概述 1)集合的概念 现实生活中的集合:很多事物凑在一起. 数学中的集合:具有共同属性的事物的总体…

Java中的集合框架(中) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,如果已经有java基础的小伙伴可以直接跳到<浅入深出之Java集合框架(下)>. 目 录 浅入深出之Java集合框架(上) 浅入深出之Java集合框架(中)   浅入深出之Java集合框架(下) 努力赶制中..关注后更新会提醒哦! 前 言 在<浅入深出之Java集合框架(上)>中介绍了List接口和Set接口的基本操作,在这篇文章中,我将介绍关于Map接口的基…

Java中的集合框架(下) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,哈哈这篇其实也还是基础,惊不惊喜意不意外￣▽￣ 写文真的好累,懒得写了.. 温馨提醒:建议从(上)开始看哦~ 目 录 浅入深出之Java集合框架(上) 浅入深出之Java集合框架(中)   浅入深出之Java集合框架(下) 前 言 在<浅入深出之Java集合框架(中) >中介绍了Map接口的基本操作.使用的示例是在<浅入深出之Java集合框架(上)>中的模拟学…

在关系型数据库中,事务的重要性不言而喻,只要对数据库稍有了解的人都知道事务具有 ACID 四个基本属性,而我们不知道的可能就是数据库是如何实现这四个属性的:在这篇文章中,我们将对事务的实现进行分析,尝试理解数据库是如何实现事务的,当然我们也会在文章中简单对 MySQL 中对 ACID 的实现进行简单的介绍. 事务其实就是并发控制的基本单位:相信我们都知道,事务是一个序列操作,其中的操作要么都执行,要么都不执行,它是一个不可分割的工作单位:数据库事务的 ACID 四大特性是事务的基础,了解了 AC…

之前写了一些关于 MySQL 的 InnoDB 存储引擎的文章,里面好几次都提到了页(Pages)这个概念,但是都只是简要的提了一下.例如之前在聊 InnoDB内存结构 时提到过,但当时的重点是内存架构,就没有展开深入. 我发现有好几次都需要提到页,那我就正好拿一篇来详细的讲讲 InnoDB 中的页. 页是什么 首先,我们需要知道,页(Pages)是 InnoDB 中管理数据的最小单元.Buffer Pool 中存的就是一页一页的数据.再比如,当我们要查询的数据不在 Buffer Pool 中时…

    Android.mk Android.mk是一个向Android NDK构建系统描写叙述NDK项目的GUN Makefile片段.它是每个NDK项目的必备组件. 构建系统希望它出如今jni子文件夹中. 以下是hello-jni项目中Android.mk文件的内容. # Copyright (C) 2009 The Android Open Source Project # # Licensed under the Apache License, Version 2.0 (the "Lic…

前言 你知道etcd吗?随着k8s的使用广泛之后,etcd被非常多的人所知道,同时又因为它可靠的分布式特性被很多人喜欢.所以,我准备有几篇博文来记录一下,从基本使用到线上部署再到原理分析,做一个系列.那么,今天先来说说它的简介与命令行的使用. 简介 ETCD是什么 我个人总结为下面用几个要点: 高可用K-V存储,就类似于redis一样的键值对存储. 允许应用实时监听存储中的K-V变化. 能够容忍单点故障,能够应对网络分区. etcd利用raft在集群中同步K-V信息,raft是强一致的集群日志同…

  Java把不同类型的输入.输出,这些输入输出有些是在屏幕上.有些是在电脑文件上, 都抽象为流(Stream) 按流的方向,分为输入流与输出流,注意这里的输出输出是相对于程序而言的,如:如对于一个Java程序创建了一个输入流(Input),此时应该是进行读取操作将数据读到程序中. 流既然是用来进行输入输出的,那么在所有的流中可以按每次输入输出的量分成两类流:字节流.字符流.顾名思义字节流每次操作为一个一个字节.字符流则每次读取一个一个字符. 额外的,在字符流中对于一个字符,不同编码方式他也有不…

环境搭建 https://github.com/c0ny1/xxe-lab 为了更深入的理解,我准备理论和实际相结合的了解XXE! 浅谈XML 初识XML 一个好的代码基础能帮助你更好理解一类漏洞,所以先学习一下XML的基础知识. XML被设计为传输和存储数据,其焦点是数据的内容,其把数据从HTML分离,是独立于软件和硬件的信息传输工具,简单来说XML主要是面向传输的. 什么是XML? XML 指可扩展标记语言(EXtensible Markup Language) XML 是一种标记语言,很类…

三.开关控件TlincoSwitch 用过Delphi1(好古老的东东呀!)的人相信都记得这个开关控件 ,不知道当初Borland为什么把这么一个在开发普通应用程序中应用不到的工控控件放到Delphi中,而且在Delphi2及其以后的版本中再也没有见过它的身影.让我们怀着怀旧的心情把这位“开国元老”请出来吧! 1.建立位图资源文件: 用Image Editor建立一个Res文件,并在文件中分别建立下面两个位图,并分别命名为SWITCHON.SWITCHOFF.保存此Res到控件单元所在目录下.…