Lovelyclown的博客

原创 redux

redux文件夹1：store.js// redux最核心的管理对象import {createStore} from 'redux'import reducer from './reducre.js'//根据指定对应的reducer函数，残生一个store对象//store对象内部管理新状态数据，状态数据的初始值为reducer()的返回值==默认的stateconst store = createStore(reducer)export default store2:redu

原创 axios 封装 以及注意事项

//axios.jsimport axios from 'axios'//添加请求拦截器axios.interceptors.request.use(function (config){ config.url = decodeURI(encodeURI(config.url).replace(/%E2%80%8B/g,'')) return config},function (error){ //请求错误时弹框提示或做其他事情 return new Promise(.

原创 vscode常用的插件（vue开发）

原创 vue以及vue.html组件的代码片段

{ "Print to console": { "prefix": "vue", "body": [ "<template>", " <div>\n", " </div>", "</template>\n", "<script>", "export de.

原创 git协同开发？对代码管理

1：git 操作//1：本地仓库（本地项目） 远程仓库（公司或者自己的远程仓库）1：创建本地仓库 1.1 ：配置 .gitignore 一般脚手架会自带 1.2 ：git init --- git add . ---git commit -m '提交信息'2：创建远程仓库 2.1 ： 去github.com 2.2 : new repository --》 repositoryName ---> 3：将本地仓库的代码关联远程仓库 3.1 : git remote add or

原创 路由 与 路由器傻傻分不清楚？

1:react-router-dom//1.1 react的一个插件库//1.2 用来实现spa应用//1.2 基于react项目基本都会用到2：使用方式//npm install react-router-dom --save//Link == NavLinkimport {Link,Route,Redirect,Switch} from 'react-dom-dom'import Components1 from './pages/Component1.jsx'import Co

原创 消息订阅与发布 --- pubsub-js

1:pubsub-js工具库//npm install pubsub-js --save//使用import PubSub from 'pubsub-js'//订阅 msg其实就是namePubSub.subscribe('name',function(msg,data){})//发布PubSub.publish('name',data)

原创 React初始化项目

为了方便开发一般用官方提供的脚手架//下载脚手架全局//npm install -g create-react-app//create-react-app projectName//一般数据遍历 map返回一个新的数组，一般对每一项的数据进行处理arr.map((item,index)=>{})...

原创 深拷贝与浅拷贝的区别！基本数据类型与引用数据类型

浅拷贝创建一个新的对象，这个对象有着原始对象属性值的一份精确拷贝。如果对象时基本类型，拷贝的就是基本类型的值，如果是引用类型，拷贝的就是内存地址var a = { name:'zd', book:{ title:'xxx', price:45 }}let b = Object.assign({},a)深拷贝let a = { name: 'xx', info: { hobby: 'eat', money: 'enough' }}let b = JSON.p

原创 你所不知道的三点运算符！

1：三点运算符的使用场景可以用三点运算符进行对象的浅克隆//1.1 函数接收参数的时候function sum(a,b,c) { return a+b+c}let arr = [1,2,3]//let result = sum(arr[0],arr[1],arr[2])let result = sum(...arr)console.log(result)//1.2 函数接收参数的时候(接收的参数个数不确定)function sum2 (...data) { /*let result

原创 有关better-scroll的左右联动问题（层及关联）

1：better-scroll//npm install better-scroll --saveimport BetterScroll from 'better-scroll'//一般在vue组件里面进行数据监视 this.$nextTick(()=>{ 代码块})initScroll () { this.leftScroll = new BetterScroll('this.$refs.refName',{ click:true }) this.rightScroll = n

原创 vuex多模块编程

1：多模块编程主要是针对于大型项目//文件目录结构//store文件夹 //index.js集成模块 //actions.js //mutations.js //modules //module1.js //module2.js const moduleA = { state:{}, actions:{}, mutations:{}, getters:{}}const moduleB = {

原创 json数据如何使用？mockjs来辅助！

//json数据设置完之后需要搭配mockjs//mockjs的作用 ==== 拦截ajax请求返回随机数据//npm install mockjs --save//文件夹mock shuju.json mockServer.jsimport Mock from 'mockjs'//加载json文件得到的是js对象/数组 不需要自己去 JSON.parse（data）import data from './shuju.json'//模拟后台接口====拦截ajax请求.

原创 什么是json数据？json数据应该怎么设计

1：json的整体结构//1.1:json数据一般分为, // json对象：{} // json数组：[]//1.2内部结构 // key为字符串，必须双引号包括住， //value可以为 string/number/boolean/{}/[]{ "key1" : value1, "key2" : value2,....} [ "value1","value2",...]2：json数据与js之间的关系//json本

原创 前后端分离==解决开发环境的vue跨域？

跨域问题：同源策略 协议 域名 端口号必须都相同才不会产生跨域vue2.X版本解决跨域//在config文件夹下的index.js下面的 proxyTablevue3.X版本//需要在根目录下创建vue.config.js===具体参考官方文档module.export = { devServer : { proxy : { //根据光放文档写配置对象 } ...

原创 封装ajax请求函数

//axios npm install axios --save//文件夹api//index.js //--包含多个请求函数的模块--函数的返回值是promise对象 import ajax from './ajax' //请求地址以 ‘/api开头’ 需要和vue.config.js里面的解决跨域问题 const BASE = '/api' //example01-根据经纬度获取位置详情 export const reqAddress = .