- 博客(33)
- 收藏
- 关注
RSS订阅原创 Nuxt前台项目部署Note
Nuxt 前台项目部署不完整cd 空格/data/htdocs/nuxtPC8. 项目暂停，执行 npm run build 来打包一下9. 中间进程执行命令 pm2 start npm --name ‘名称’ – run start成功
2021-02-05 17:21:11
208
原创 三级目录Note
三级目录以及上下课时功能描述：点击课时跳转视频播放页面，然后点击上下课时视频需要实时跟新写这块还是比较复杂的，费了我老长时间，下面是我整理的解决思路点击上一课时 i k j1.2拿到目录数组，遍历拿到当前课时数据，对比传递过来的课时id和当前遍历拿到的课时id，相等时再做操作。1.3 如果 j=0, 没有上一课，else j-1 取上一课时的的id，去调用播放1.4 如果 k=0,没有上一节，else k-1 取上一节的最后一个课时的id，去调用播放1.5 如果 i=0,没有
2021-02-05 17:15:37
217
原创 utf-8 和 utf8 的亿点细节
“UTF-8” 是标准写法，php 在 Windows 下边英文不区分大小写，所以也可以写成 “utf-8”。“UTF-8” 也可以把中间的"-“省略，写成 “UTF8”。一般程序都能识别，但也有例外（如下文），为了严格一点，最好用标准的大写"UTF-8”。在数据库中只能使用"utf8"(MySQL) 在MySQL的命令模式中只能使用"utf8"，不能使用"utf-8"，也就是说在PHP程序中只能使用 “set names utf8(不加小横杠)”，如果你加了"-“此行命令将不会生效，但是在 PHP 中
2020-11-03 08:28:37
470
原创 自定义封装element-ui-table组件
为什么对element进行二次封装？element-ui组件的部分样式不满足当前项目需求element-ui组件出现问题的时候，我们用中间件支持，不至于整个项目崩塌。二次封装的弊端：因为我们对element-ui进行了二次封装，当element-ui组件升级的时候，所以我们封装的组件不能直接使用element-ui的新方法，就需要有人不断的对组件进行维护，有一定的开发成本。封装步骤：在 components 文件夹下创建一个 element-table 文件夹，在里边分别创建
2020-09-14 08:13:40
488
原创 Element-UI工具使用随笔
Vue中常用的UI框架PC ： Element-UI , iViewM站(移动端) ：VantVue-Cli版本2.x : 老版本3.x : 主要版本【注意】vue的工具是3.x版本，并非vue是3.x版本，目前vue任然还是2.x版本Element-UI打开element-ui的快速上手，找到打开里边的Element插件，跳转到github上。第一步 ：Vue安装element插件命令 : vue add element(不需要npm)会出现两个选项 Fully imp..
2020-09-13 23:29:21
255
原创 vue国际化插件
第一步：安装 npm i -S vue-i18n第二步：在assets文件夹下创建lang文件夹，在里边创建en.json和zh.json文件{ // en.json "common":{ "home":"home", "info":"info" } }{ // zh.json "common":{ "home":"首页", .
2020-09-13 23:17:39
250
原创 Vue实现头部导航
views文件下创建 Layout.vue ，Mine.vue, Search.vue, Topic.vue组件配置路由，Layout组件是入口文件，其他组件作为Layout组件的子组件配置点击高亮–> linkActiveClass : “active”,const router = new VueRouter({ mode: 'history', base: process.env.BASE_URL, linkActiveClass: "active", /..
2020-09-13 22:57:35
1090
原创 微信小程序随笔
整个小程序框架系统分为两部分：逻辑层(App Service)和视图层(View)。小程序的运行环境分为 渲染层 和 逻辑层 ，其中wxml模板和wxss样式工作再渲染层，js脚本工作在逻辑层。小程序里没有DOM BOM全局App.js绑定生命周期回调函数，错误监听和页面不存在监听函数app.js 小程序 全局逻辑生命周期回调函数：小程序从创建到消失，整个过程 产生的一些 函数onLaunch：监听小程序初始化，只执行一次onShow: 监听小程序启动或者..
2020-09-13 22:02:19
168
原创 Vue-swiper插件使用随笔
安装 ：vue-awesome-swiper@3.1.3（swiper插件）swiper@5.2.0全局引入：import VueAwesomeSwiper from 'vue-awesome-swiper';import 'swiper/css/swiper.css'//有时候会报错，找node_modules文件夹 Vue.use( VueAwesomeSwiper )在组件中配置：<swiper :options="swiperOption"> ..
2020-09-13 21:23:53
169
原创 markdown使用说明
markdown文本，创建的文件后缀是.md结尾的， 是在github，npm,码云等代码托管平台上使用一种文本格式，在这种网站上会自动展示.md文件的内容，主要是说明功能
2020-09-13 10:58:55
139
原创 远程仓库之码云(gitee)
Github(全球最大的代码托管平台)。https://github.com/这个网站就是提供Git仓库托管服务的。由于你的本地Git仓库和GitHub仓库之间的传输是通过SSH加密的，所以，需要一点设置：创建SSH Key。在用户主目录下，看看有没有.ssh目录，如果有，再看看这个目录下有没有 id_rsa 和 id_rsa.pub 这两个文件，如果已经有了，可直接跳到下一步。如果没有，打开Shell（Windows下打开Git Bash），创建SSH Key：$ ssh-keygen -t
2020-09-13 10:31:51
232
原创 Git协同开发工具随笔
协同开发工具(版本控制器)目前使用最广泛的就是svn和git主要作用：管理项目的版本，多人协同开发List itemsvn和git帮我们管理项目svn：集中式git：分布式Git参考站点：https://www.liaoxuefeng.com/wiki/896043488029600/896067008724000git是目前世界上最先进的分布式版本控制系统安装Git初始化git ：电脑桌面右键打开 Git Bash Here 命令窗口，然后输入下面命令:创建版..
2020-09-13 09:58:01
207
原创 SVN协同开发工具随笔
协同开发工具(版本控制器)目前使用最广泛的就是svn和git主要作用：管理项目的版本，多人协同开发svn 和 git 帮我们管理项目svn：集中式git：分布式SVN安装SVN打开服务器：注意事项：svn的服务器默认是80端口，所以和xampp的端口冲突推荐修改svn服务器端口：打开服务器端找一个链接名为 Conflgure logging… ,点击进去之后找Network下边的Server port 即可修改（随意修改）例如：8989 Configure..
2020-09-13 08:36:26
303
原创 ES6随笔(重点)
块级作用域 ：暂时性死区ES5 只有两种声明变量的方法：var命令和function命令。ES6 除了添加let和const命令，后面章节还会提到，另外两种声明变量的方法：import命令和class命令。顶层对象属性globalThis数组的解构赋值对象的解构赋值字符串的正则方法 ：字符串对象共有 4 个方法，可以使用正则表达式：match()、replace()、search()和split()。arguments对象不是数组，而是一个类似数组的对象。所..
2020-09-13 08:09:21
146
原创 Vue组件(点击返回顶部)
在components文件夹下创建 ClientHeight.vue 和 index.js 文件 //ClientHeight.vue配置<template> <div class="th-back-top" v-show="flag" @click="clickHidden"> <span class="bg-back2top2"></span> </div></template><s.
2020-09-12 22:48:14
158
原创 Vue-echarts插件随笔(二地图)
Vue 使用 echarts 地图实例第一步：安装：npm i -S echarts安装echarts依赖后，打开node_modules下边的map文件夹里边的js。js文件下有：china.js–>中国地图world.js–>世界地图province文件夹—>各个省份地图第二步 : 在全局 main.js 引入地图资源import Echarts from './plugin/echarts' Vue.use(Echarts);import "../node_modu
2020-09-12 22:25:01
172
原创 Vue- echarts插件使用随笔(一图表)
Vue 使用 echarts 图表实例第一步：安装：npm i -S echarts第二步：创建一个plugins文件夹，创建echarts.js并配置import echarts from 'echarts' const install = function (Vue){ //将 echarts 挂载到 vue 原型上 Object.defineProperties(Vue.prototype,{ $charts: { get(){
2020-09-12 22:16:05
193
原创 Babel随笔
Babel是一个es6转码器项目安装 npm install -D @babel/core 安装命令行工具@babel/cli npm install -D @babel/cli 在项目根目录下创建一个.babelrc配置文件，配置文件：{ "presets" : [ "@babel/env" ], "plugins" : [] } presets字段设定转码规则 npm i - D @babel/preset-env...
2020-09-12 21:50:41
100
原创 Vuex随笔
Vuex本质上使用Vuex的原因其实是组件之间的数据交互过于复杂，重点在于当组件过多时，数据的传递就会不可控，所以引入 Vuex 是一个专门为 Vue.js 应用程序开发的状态管理模式。它采用集中式管理应用的所有组件的状态，并以相应 的规则保证状态以一种可预测的方式发生变化。回顾数据传递方式：props , 自定义事件$emit(.sync) , EventBus , $parent , $root，vuex 。组件较少的情况下传递数据可以使用EventBus ; 组件特别多，而且对数据要求可
2020-09-12 13:46:54
150
原创 Vue Axios请求随笔
Axios请求Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。Axios特性1. 从浏览器中创建 XMLHttpRequests2. 从 node.js 创建 http 请求3. 支持 Promise API4. 拦截请求和响应5. 转换请求数据和响应数据6. 取消请求7. 自动转换 JSON 数据8. 客户端支持防御 XSRF安装npm install axios -S全局引用import axios from 'axi
2020-09-12 12:57:38
346
原创 Vue Router随笔
用 Vue.js + Vue Router 创建单页应用，是非常简单的。安装 ：npm install --save vue-router引入并使用：main.js文件中引入全局使用import VueRouter from ‘vue-router’Vue.use(VueRouter)创建路由实例const router = new VueRouter({ routes //es6(缩写) 相当于 routes: routes })挂载到Vue根实例上new
2020-09-12 12:50:00
209
原创 Vue封装网络请求
请求成功和请求失败请求成功之后，获取结果的成功与失败工作中网络请求的数据有很多，所以我们需要将网络请求封装准备工作：src文件夹下创建utils文件夹，在utils文件夹下创建request.js文件//封装网络请求 import $axios from "axios" import qs from "query-string" // 错误信息的响应方法 const errorHandle = (status,other) => { switch(status)
2020-09-12 10:17:39
264
原创 Vue随笔
Vue是一套构建用户界面的渐进式框架，与其他框架不同的是，Vue可以自底向上逐层应用。Vue的核心库只关注视图层易于上手，还便于与第三方库或既有项目整合。兼容性：Vue不支持IE8及以下版本，因为Vue使用了无法模拟的ES5特性，但它支持所有兼容ES5的浏览器。 Vue虽然没有完全遵循MVVM模型，但是 Vue 的设计也受到了它的启发。因此在文档中经常会使用 vm (ViewModel 的缩写) 这个变量名表示 Vue 实例。开发者工具：再使用Vue时，推荐再浏览器上安装Vue Devtools。它
2020-09-12 10:01:37
254
原创 登录注册完整流程
开发场景描述：当准备从零开始做一个项目时，此时前后台同时开发，由于后台可能会由于时间问题不能提供数据，此时就需要前端人员模拟数据，例如Mock。在外面的Vue中，同样可以实现mock的操作模拟数据。需要对 JWT (Json Web Token) 和 token 有一定认知。实现登录部分第一步 ：搭建vue基本项目框架，前端安装 npm i --save axios ，创建一个登录页面 Login<template> <div> 账号：<input t
2020-08-25 08:33:09
3808
原创 React入门随笔
ReactReact不是一个框架，是一个用于构建用户界面的JS库，实现单页面应用。React用于在前端构建用户界面（UI）。React是MVC应用程序的视图层（模型视图控制器）。多页面应用：页面跳转时跳转的都是完整的html页面单页面应用：只有一个html页面，所有内容都在这个页面中展示，通过’路由’来加载不同内容。全部是通过js来控制显示的。优点：用户体验比较好，加载比较流畅。缺点：不利于seo(网站优化，影响搜索排名)，解决办法ssr(服务端渲染)起步安装 先决条件 ：全局安装了Node.
2020-08-21 11:18:11
247
原创 Express随笔
Express是基于Node.js平台，快速，开放，极简的Web开发框架。1.Node.js原生的http在某些方面表现不足以应对我们的开发需求，所有就需要使用框架来加快我们开发效率，框架的目的就是提高效率，让我们的代码更高度统一。安装：cnpm install --save express文件操作中的相对路径可以省略在模块加载中，require 相对路径中的 ./ 不能省略，否则报错修改完代码自动重启这里使用一个第三方命名工具：nodemonnodemon 是一个基于Node
2020-08-16 08:36:16
135
原创 NodeJs随笔
NodeNode.js：不是框架，不是语言，是JS运行时环境。Node.js特性：1.事件驱动 2.非阻塞IO模型(异步) 3.轻量和高效Node.js没有 BOM 和 DOMNode 不适合从来没有接触过服务端的人学习，如果想要真正学好服务端，还是老牌 Java,PHPNode 不是特别适合入门服务端，但是不代表 Node 不强大Node 很厉害，具有经验的人可以玩的非常牛，不适合的原因就在于比较偏底层，而且太灵活；Java,PHP 好入门的原因在于：这些平台屏蔽了一些底层
2020-08-15 11:21:21
178
原创 CSS常用命名规范
CSS 命名一般采用小写英文单词或组合命名，单词与单词之间以"-"分割，而且英文单词不缩写，除非是那种简单一眼看上去就能明白的单词。常用的CSS命名规范有 : 文本命名规范，页面结构命名规范，导航命名以及功能命名等。接下来在文章中分享一些CSS中常用的命名规范，希望对大家有所帮助。文本命名规范index.css： 一般用于首页建立样式head.css： 头部样式，当多个页面头部设计风格相同时使用。base.css： 共用样式。style.css：独立页面所使用的样式文件。global.css：页
2020-08-14 08:33:00
389
原创 前端工作流程
@前端工作大致流程分析大公司工作流程：产品经理：负责和客户或者用户沟通，掌握用户体验，反馈到项目经理，制作需求文档项目经理：接受产品信息反馈，找对应的程序员去解决问题，负责公关项目中的难点，对整个项目负责(前后台 ui)UI： 根据需求文档出原型图 设计稿 不断的和产品经理沟通，校队设计中的问题前端后台同时开工前端 原型图或者设计稿 -->代码化 实现网页的各种效果后台 后台根据原型图 设计数据管理系统。后台业务逻辑，前端提供数据接口，前端拿到数据口之后，数据渲染
2020-08-14 08:06:28
770
原创 Less预处理语言
Less是css的预处理语言，LESS将CSS赋予了动态语言的特性，如：变量，继承，运算，函数。css预处理语言编写的代码，浏览器不认识，需要编译成浏览器能认识的真正的css准备工作创建less文件：创建一个以.less为后缀的文件，把css写在这个文件中，就可以使用动态特性了使用编译工具lessc 命令行编译工具gulpwebpack命令行工具cmd中执行脚本命令用计算机底层的一些命令，或执行第三方提供的功能安装：使用cmd把第三方模块安装到计算机中nodejs中有一个npm
2020-08-13 18:20:15
316
原创 Gulp打包
Gulp基于流的自动化打包工具(对项目进行打包----项目工程化)，除了可以管理和执行任务，还可以监听文件，读写文件。优点：既可以单独完成构建也可以和其他工具搭配使用；缺点和Grunt类似，集成度不高，要写很多配置后才可以使用，无法做到开箱即用。安装配置安装全局安装：npm i -g gulp全局gulp命令行工具： gulp-cli : npm i -g gulp-cli在项目中使用：1.安装项目依赖： npm install --save-dev gulp == npm i -D
2020-08-13 10:30:15
332
原创 Web-安全 网络安全
Web安全首先安装 WordPress 网址：https://cn.wordPress.org互联网安全事件：希拉里邮件门，openSSL心脏出血。。。 PHP 网站占比很高，也是安全事故多发地XSS攻击XSS攻击：是跨站脚本攻击，主要使用JavaScript向网站注入代码，以实现盗号窃取资料的目的。XSS是互联网中使用最广泛的攻击手段之一。XSS攻击由于被黑客用来编写危害性更大的网络钓鱼攻击变得广为人知。(钓鱼攻击：在登录页面注入代码，在登陆之前悄悄跳转自己的虚假页面，然后就可以获取用
2020-08-05 17:34:20
588
原创 Webpack打包器
webpack:1.模块打包器，主要是将Js文件打包在一起,如果不是js文件就使用loader把非js文件转成js文件后再打包。webPack也是基于NodeJs搭建，默认使用commonjs规范。在Webpack里一切文件皆模块，通过Loader转换文件，通过Plugin注入钩子，最后输出由多个模块组合成的文件。Webpack专注于构建模块化项目。2.常见的构建工具对比1.Npm Scripts(必须掌握)：npm安装时会产生一个package.json文件，文件中有一个字段"scripts",这.
2020-08-05 16:28:20
229
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人