Vuex 是什么?Vuex 是一个专为 Vue2.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。是一个状态共享框架
Vuex是采用集中式管理组件依赖的共享数据的一个工具,可以解决不同组件数据共享的问题
Vuex基础-初始化功能(store)每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的**状态 (state)**。Vuex 和单纯的全局对象有以下两点不同:
Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候,若 store 中的状态发生变化,那么相应的组件也会相应地得到高效更新。
你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation。这样使得我们可以方便地跟踪每一个状态的变化,从而让我们能够实现一些工具帮助我们更好地了解我们的应用。
建立一个新的脚手架项目, 在项目中应用vuex
1$ vue create learnvuex
...
前端开发
未读1.认识express
简介:基于 Node.js 平台,快速、开放、极简的 Web 开发框架
类似于Node.js中的内置模块http模块,专门用来创建Web服务器。
安装首先假定你已经安装了 Node.js,接下来为你的应用创建一个目录,然后进入此目录并将其作为当前工作目录。
12$ mkdir myapp$ cd myapp
通过 npm init 命令为你的应用创建一个 package.json 文件。 欲了解 package.json 是如何起作用的,请参考 Specifics of npm’s package.json handling.
1$ npm init
此命令将要求你输入几个参数,例如此应用的名称和版本。 你可以直接按“回车”键接受大部分默认设置即可,下面这个除外:
1entry point: (index.js)
键入 app.js 或者你所希望的名称,这是当前应用的入口文件。如果你希望采用默认的 index.js 文件名,只需按“回车”键即可。
接下来在 myapp 目录下安装 Express 并将其保存到依赖列表中。如下:
1$ npm instal ...
包管理工具
概念介绍包是什么
『包』英文单词是 package ,代表了一组特定功能的源码集合
包管理工具管理『包』的应用软件,可以对「包」进行 下载安装 , 更新 , 删除, 上传等操作
借助包管理工具,可以快速开发项目,提升开发效率
包管理工具是一个通用的概念,很多编程语言都有包管理工具,所以 掌握好包管理工具非常重要
常用的包管理工具下面列举了前端常用的包管理工具
npm
yarn
cnpm
npm
npm 全称 Node Package Manager ,翻译为中文意思是『Node 的包管理工具』
npm 是 node.js 官方内置的包管理工具,是 必须要掌握住的工具
npm 的安装node.js 在安装时会 自动安装 npm ,所以如果你已经安装了 node.js,可以直接使用 npm
可以通过 npm -v 查看版本号测试,如果显示版本号说明安装成功,反之安装失败
查看版本时可能与上图版本号不一样,不过不影响正常使用
npm 基本使用初始化创建一个空目录,然后以此目录作为工作目录 启动命令行工具,执行 npm init
npm init 命令的作用是将文件 ...
jQuery第一部分1.使用准备首先来对比一下jQ语法和原生Dom语法
1234567// 原生js let liArr = document.querySelectorAll('li') for (let i = 0; i < liArr.length; i++) { liArr[i].onclick = function () { this.style.backgroundColor = 'orange' } }
1234// jQuery $('li').click(function () { $(this).css('backgroundColor', 'orange')})
可以发现,通过jQ语法操作样式要比原生操作Dom简单不少,那么如何使用jQ呢?下面介绍
下包:你得先把这个别人写好js文件下载到本地
导包:下载完毕之后需要导入到使用的页面中
另起一行script输出一下$, ...
1.webpack基本概念本质上,webpack 是一个用于现代 JavaScript 应用程序的 静态模块打包工具。当 webpack 处理应用程序时,它会在内部从一个或多个入口点构建一个 依赖图(dependency graph),然后将你项目中所需的每一个模块组合成一个或多个 bundles,它们均为静态资源,用于展示你的内容。
2.webpack使用步骤2.1基础使用默认入口: ./src/index.js
默认出口: ./dist/main.js
初始化包环境
1yarn init
安装依赖包
1yarn add webpack webpack-cli -D
配置scripts
123"scripts":{"build":"webpack"}
新建目录src新建src/add/add.js - 定义求和函数导出
1234//导出该函数export const addFun = (a,b)=>{ return a + b}
新建src ...
开发总结
未读数组去重操
数组去重我们使用:set对象,这是ES6中提出的新语法。
基本语法: const obj = new Set([1, 2, 3, 3, 4])
Set 对象:
定义:Set 是一种存储唯一值的集合数据结构。
创建:new Set([iterable])
主要方法:
add(value):添加值
delete(value):删除值
has(value):检查值是否存在
clear():清空 Set
size:获取 Set 大小
特点:
值唯一性
可存储任何类型的值
不使用索引,而是使用键来引用值
遍历:
forEach()
for…of 循环
常见用途:
数组去重
检查元素是否存在
实现集合运算(交集、并集、差集)
示例:
1234const mySet = new Set([1, 2, 3, 3, 4]);console.log(mySet); // Set(4) {1, 2, 3, 4}mySet.add(5);console.log(mySet.has(3)); // true
与数组转换:
Set 转数组:[…m ...
前排提示,该学习教程省略了开发软件的安装,和网易云音乐接口的配置与启动。本教程直接从新建项目开始
新建项目1.点击文件–>新建–>项目
2.设置详情
3.项目结构
填写微信小程序ID(建议)建议大家前往小程序网站,注册并填写小程序ID,以防止有些功能无法实现
小程序网站:https://mp.weixin.qq.com/
在网站页面左侧菜单栏点击开发管理,复制你的小程序ID
回到开发工具中,按照如下勾选即可
字体和图标字体建议使用uniapp默认即可,图标建议使用uniapp官方提供的图标库插件,下载地址:https://uniapp.dcloud.net.cn/component/uniui/uni-icons.html#uni-icons-%E5%9B%BE%E6%A0%87
开始头部导航栏编写头部组件中
12345678910111213141516171819<template> <view> {{title}} </view></template><scrip ...
1. Nginx安装目录(对于源码安装):
当使用源代码编译安装 Nginx 时,整个 Nginx 的安装树可能位于此目录下。这包括可执行文件、配置文件、文档和模块文件等。
内部可能包含以下子目录:
client_body_temp: 用于存储上传的大文件的临时目录。
conf: 包含所有的配置文件,如 nginx.conf,以及其他的配置片段或模块配置。
html: 这是 Nginx 的默认网站根目录,通常包含默认的 HTML 页面。
logs: 类似于 /var/log/nginx,用于存储日志文件。
mime.types: 包含 MIME 类型的定义,用于识别和处理不同的文件类型。
modules: 可能包含 Nginx 的模块文件,用于扩展 Nginx 的功能。
sbin: 包含 Nginx 的二进制可执行文件。
2. Nginx多线程请求模型和基本请求流程
Nginx 的设计并不基于传统的多线程模型来处理请求,而是采用了异步非阻塞的事件驱动模型。Nginx 使用了多进程(多worker进程)模型来提高并发性能和稳定性,每个worker进程内处理请求时则利用了高效的事件处 ...
