随笔分类 - 前端
客户端技术,包括DHTML、CSS+Div、JQuery、Photoshop等
摘要:一、JSX 1.1、什么是JSX? JSX = JavaScript XML,这是React官方发明的一种JS语法(糖) 概念:JSX是 JavaScript XML(HTML)的缩写,表示在 JS 代码中书写 HTML 结构 设想如下变量声明: const element = <h1>Hello,
阅读全文
摘要:一、概要 React是用于构建用户界面的MVVM框架。 1.1、介绍 React 是 Facebook 开发的一款 JavaScript 库,而 React 被建造是因为 Facebook 认为市场上所有的 JavaScript MVC 框架都不能满足他们的扩展需求, 由于他们非常巨大的代码库和庞大
阅读全文
摘要:一、组件 如果我们将一个页面中所有的处理逻辑全部放在一起,处理起来就会变得非常复杂,而且不利于后续的管理以及扩展,但如果,我们将一个页面拆分成一个个小的功能块,每个功能块完成属于自己这部分独立的功能,那么之后整个页面的管理和维护就变得非常容易了。如果我们将一个个功能块拆分后,就可以像搭建积木一下来搭
阅读全文
摘要:一、模板语法 Vue 使用一种基于 HTML 的模板语法,使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML,可以被符合规范的浏览器和 HTML 解析器解析。 在底层机制中,Vue 会将模板编译成高度优化的 JavaScript 代码。结合
阅读全文
摘要:一、常用 Composition API 官方文档: https://v3.cn.vuejs.org/guide/composition-api-introduction.html 组合式 API (Composition API) 是一系列 API 的集合,使我们可以使用函数而不是声明选项的方式书
阅读全文
摘要:一、前端MVC概要 1.1、库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束。库是工具,在单点上给我们提供功能。框架是依赖库的。Vue是框架而jQuery则是库。 1.2、MVC(Model View Controller) MVC的核心理念是:你应该把管理数据的代码(Model)、
阅读全文
摘要:一、TypeScript概要 TypeScript是一种由微软开发的自由和开源的编程语言,它是JavaScript的一个超集,扩展了JavaScript的语法,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。安德斯·海尔斯伯格,C#的首席架构师,工作于TypeScript的开发。 官
阅读全文
摘要:一、BEM 1.1、BEM概要 在CSS类名中“--”和“__”是什么?它们的出现是源于BEM和Nicolas Gallagher BEM的意思就是块(block)、元素(element)、修饰符(modifier),是由Yandex团队提出的一种前端命名方法论。这种巧妙的命名方法让你的CSS类对其
阅读全文
摘要:一、使用开发者工具,获得链接后下载 二、批量获取chrome缓存文件 1、找到缓存文件夹并清空 在chrome的地址栏中输入chrome://version/,个人资料路径就是缓存文件所在位置,如: 下面的cache目录就是缓存文件了,如:C:\Users\Administrator\AppData
阅读全文
摘要:一、概要 1.1、Vuex定义与注意事项 Vuex是为vue.js框架更好的管理状态而设计一个插件。Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具
阅读全文
摘要:路由是根据不同的 url 地址展示不同的内容或页面,早期的路由都是后端直接根据 url 来 reload 页面实现的,即后端控制路由。 后来页面越来越复杂,服务器压力越来越大,随着AJAX(异步刷新技术) 的出现,页面实现非 reload 就能刷新数据,让前端也可以控制 url 自行管理,前端路由因
阅读全文
摘要:一、概要 1.1、前端工程化 随着前端的不断发展与壮大,前端变得越来越复杂,组件化、模块化、工程化、自动化成了前端发展中不可或缺的一部分,具体到前端工程化,面临的问题是如何提高编码->测试->维护阶段的生产效率。 前端工程化是使用软件工程的技术和方法来进行前端项目的开发、维护和管理。 前端工程化是依
阅读全文
摘要:早期的javascript版本没有块级作用域、没有类、没有包、也没有模块,这样会带来一些问题,如复用、依赖、冲突、代码组织混乱等,随着前端的膨胀,模块化显得非常迫切。 前端模块化规范如下: 一、前端模块化概要 1.1、模块概要 JavaScript在早期的设计中就没有模块、包、类的概念,开发者需要模
阅读全文
摘要:一、前端概要 web前端开发者最最注的内容是三个:HTML、CSS与JavaScript,他们分别在不同方面发挥自己的作用,HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能与业务。当然内容与用户资源也是不能忽视的。尽量不要跨职责范围使用,有点“SRP单一职责
阅读全文
摘要:使用vue-cli可以规范项目,提高开发效率,但是使用vue-cli时需要一些ECMAScript6的知识,特别是ES6中的模块管理内容,本章先介绍ES6中的基础与模块化的内容再使用vue-cli开发vue项目。 一、ECMAScript6概要 ECMAScript是一种由Ecma国际(前身为欧洲计
阅读全文
摘要:一、axios Vue更新到2.0之后宣告不再对vue-resource更新,推荐使用axios,axios是一个用于客户端与服务器通信的组件,axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端javaScript工具。通俗来说可以实现客户端请求服务器端提供的服务
阅读全文
摘要:一、表单输入绑定 1.1、基础用法 你可以用 v-model 指令在表单控件元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但 v-model 本质上不过是语法糖,它负责监听用户的输入事件以更新数据,并特别处理一些极端的例子。 v-model 并不关心表单控件初始
阅读全文
摘要:一、条件渲染 1.1、v-if 在字符串模板中,如 Handlebars ,我们得像这样写一个条件块: 在 Vue.js ,我们使用 v-if 指令实现同样的功能: 也可以用 v-else 添加一个 “else” 块: 1.1.1、template v-if 因为 v-if 是一个指令,需要将它添加
阅读全文
摘要:Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。 在底层的实现上, Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,在应用状态改
阅读全文
摘要:一、Vue的实例 1.1、创建一个 Vue 的实例 每个 Vue 应用都是通过 Vue 函数创建一个新的 Vue 实例开始的: 虽然没有完全遵循 MVVM 模型,Vue 的设计无疑受到了它的启发。因此在文档中经常会使用 vm (ViewModel 的简称) 这个变量名表示 Vue 实例。 1、vue
阅读全文