newbeeAmay的博客

原创 Gis展示系统简单搭建

gis

原创 2021-05-30spring容器创建

原创 vuex-todolist

组件访问vuex内数据方式使用this.$store.state.countvuex中数据更改操作在vuex中不能直接修改state里的数据，这样做没有经过vuex的监控，不推荐。而是通过mutation修改合理。actiongetterstodolist案例学习1.首先获取最初list值 在组件的create（）生命周期函数中获取数据，2.实现input框的双向绑定首先在store里设置inputValue，再传给组件，利用value绑定给input 再使

原创 2020-09-03

原创 node gulp

fs是一个文档系统的api ，调用后可对文件进行操作。node创建服务器1.加载http核心模块var http = require（‘http“）2.创建一个服务器http.createServer()4.启动服务器

原创 数据结构与算法1

数组结构1.在c语言中数组的使用有两个步骤。首先数组中必须存放相同的数据类型，申请数组的内存空间时，必须指定数组的大小。2.js优化：采用类似于c语言的方式定义数组。3.数组的扩容，当你先申明的数组内存空间不足时，此时会生成一个新数组内存是原数组的两倍，将原数组的值一个一个放在新数组中，-----效率低下4.在数组前面或中间插入或删除元素时，所有元素会位移让出位子来给新元素，因此效率很低。5.为什么还要使用数组呢，因为数组的查找效率非常高O(1)。栈在顶部操作元素，先进后出，后进先出。js中

原创 es6

ES6语法目标能够说出使用let关键字声明变量的特点能够使用解构赋值从数组中提取值能够说出箭头函数拥有的特性能够使用剩余参数接收剩余的函数参数能够使用拓展运算符拆分数组能够说出模板字符串拥有的特性ES6相关概念（★★）什么是ES6ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-zanS7XCU-1598865698782)(images/es-v

原创 正则

JavaScript高级第04天笔记1.正则表达式概述1.1什么是正则表达式正则表达式（ Regular Expression ）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。正则表通常被用来检索、替换那些符合某个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线， 昵称输入框中可以输入中文(匹配)。此外，正则表达式还常用于过滤掉页面内容中的一些敏感词(替换)，或从字符串中获取我们想要的特定部分(提取)等 。其他语言也会使用正则表达式，本

原创 js高级3

JavaScript高级第03天笔记1.函数的定义和调用1.1函数的定义方式方式1 函数声明方式 function 关键字 (命名函数)function fn(){}方式2 函数表达式(匿名函数)var fn = function(){}方式3 new Function()var f = new Function('a', 'b', 'console.log(a + b)');f(1, 2);var fn = new Function('参数1','参数2'..., '

原创 js 高级 2

JavaScript高级第02天笔记1.构造函数和原型1.1对象的三种创建方式–复习字面量方式var obj = {};new关键字var obj = new Object();构造函数方式function Person(name,age){ this.name = name; this.age = age;}var obj = new Person('zs',12);1.2静态成员和实例成员1.2.1实例成员实例成员就是构造函数内部通过this添加的

原创 2020-08-28

JavaScript高级第01天笔记1.面向过程与面向对象1.1面向过程面向过程就是分析出解决问题所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候再一个一个的依次调用就可以了。1.2面向对象面向对象是把事务分解成为一个个对象，然后由对象之间分工与合作。1.3面向过程与面向对象对比面向过程面向对象优点性能比面向对象高，适合跟硬件联系很紧密的东西，例如单片机就采用的面向过程编程。易维护、易复用、易扩展，由于面向对象有封装、继承、多态性的特性，可以设计出低

原创 购物车

详情转跳购物车1.在详情界面监听按钮，emit发射事件去detail组件，2.获取即将在购物车中展示的信息3.利用vuex管理数据4.在mutations里进行修改数据这样不好可以直接把getters里的在组件的computed里面使用 === getters转化为计算属性...

原创 mall首页刷新

滚动区域bug的处理1.出现原因，因为better-scroll在图片刷新时，由于图片加载速度的限制，导致最终的scrollheight不够，2.解决办法，在每次图片刷新时，进行一次refresh（）操作。如何将GoodsListItem.vue中的事件传入到Home.vue中因为涉及到非父子组件的通信, 所以这里我们选择了事件总线bus ->总线Vue.prototype.$bus = new Vue()this.bus.emit(‘事件名称’, 参数)this.bus.on(

原创 vue项目体会

关于数据请求1.单独封装一个requestimport axios from 'axios'export function request(config) { // 1.创建axios的实例 const instance = axios.create({ baseURL: 'http://152.136.185.210:8000', timeout: 5000 }) // 2.axios的拦截器 // 2.1.请求拦截的作用 instance.interce

原创 项目1

vue create name1.第一步划分目录结构asset里面放图片和css资源components放可以共用的组件 里面再分为 common（放一些完全公共的组件其他项目也能用）content（和当前业务相关的组件）network写关于数据请求routet关于路由store关于vuexviews关于当前项目使用的组件引用2个css文件起别名项目的模块划分网页小图标修改首页导航栏的封装<template> <div class="nav-bar"&g

原创 axios

axios的基本使用1.第一步先安装axiosnpm Install --save axios2.第二步在需要用axios的地方导入import axios from “axios ”3.简单的请求数据axios({ url: 'http://152.136.185.210:8000/home/multidata', // method: 'post'}).then(res => { console.log(res);})axios({ url: 'http

原创 vue复习5

路由导航为什么要使用路由导航呢？router.beforeEach((to,from,next) => { document.title = to.matched[0].meta.title next()})这里的to是一个route，是即将要到达的路由，数据必须定义在routes里的meta里 ，next（）函数必须调用钩子 === 回调后置导航守卫不需要 next（） ，在路由跳转后调用keep-alive 遇见vue-routertabbar在style中引

原创 vue复习4

前端渲染和后端渲染后端渲染 ，也叫服务器渲染，通过url 在服务器就渲染完成。前端渲染，由js代码在浏览器中执行最终渲染出来的前端路由和后端路由后端路由：后端处理url和页面之间的映射关系单页面复应用...

原创 vue复习3

高阶函数// 2.for (let i in this.books) //直接拿到序号 // let totalPrice = 0 // for (let i in this.books) { // const book = this.books[i] // totalPrice += book.price * book.count // } // // return totalPrice // 3.

原创 vue第二天复习

计算属性的setter和getterset和get是fullName对象的两个函数 ，一般用不到计算属性的set方法，因为我们不希望数据是别人给的，而是使用服务器获取来的。所以set一般都是省略了，只使用get，既然如此，我们就可以使用省略写法。因此我们在调用计算属性时就可以直接写对象名字而不用加 （）了，因为我们调用的是对象。 computed: { // fullName: function () { // return this.firstName + ' ' +

原创 vue复习1

vue的编程范式是声明式编程js的是命令式编程 // let(变量)/const(常量) // 编程范式: 声明式编程 const app = new Vue({ el: '#app', // 用于挂载要管理的元素 data: { // 定义数据 message: '你好啊,李银河!', name: 'coderwhy' } }) // 元素js的做法(编程范式: 命令式

原创 2020-08-11

节点offsetParent 查找定位的父元素firstChild 和firstElementChild操作元素属性创建，插入，删除dom元素createElement（标签名）创建之后不能不管，需要使用他 ，这就用到了插入元素，父级.appendChild(节点) 但是这个是添加到末尾再后面插入search（）oUl2.appendChild(oLi); //1.先把元素从原有父级上删掉 2.添加到新的父级运动主要由定时器组成第一步就是先消除定时器，2.根据目标是

原创 2020-08-09

js中改变字符串内容1.concat（‘ 字符串’）可以添加内容，内容就为concat里的内容``2.substr(‘截取的起始位置’, ‘截取几个字符’)，可以截取已有的字符串内容 // 1. concat('字符串1','字符串2'....) var str = 'andy'; var cha = str.concat('add'); alert(cha) console.log(str.concat('red'));

原创 js--pink

关于排他思想先干掉所有人，再给自己添加属性/ 1. 获取所有按钮元素 var btns = document.getElementsByTagName('button'); // btns得到的是伪数组 里面的每一个元素 btns[i] console.log(btns); for (let i= 0; i< btns.length; i++) { btns[i].onclick = function ()

原创 vuex 笔记

1.基本使用方法mutation 中不能使用异步操作在action里使用异步操作，用于替代mutation

原创 promise笔记

promise的基本使用// 什么情况下会用到Promise?// 一般情况下是有异步操作时,使用Promise对这个异步操作进行封装// new -> 构造函数(1.保存了一些状态信息 2.执行传入的函数)// 在执行传入的回调函数时, 会传入两个参数, resolve, reject.本身又是函数new Promise((resolve, reject) => { setTimeout(() => { // 成功的时候调用resolve /

原创 vue router

前端路由的核心是什么呢？改变url，但是页面不进行整体的刷新。利用url 的hashlocation.hash = ‘qqwe’2.html5新增的history模式： pushState这种方式类似于向栈里添加数据history.pushState({ data }, ’ title’, 'url ')history.back() //出栈3.replaceStatehistory.replaceState({ data }, ’ title’, ‘url ‘)这种方式

原创 openlayers 1

实例一 第一个地图每一个openlayers的地图都是ol.Map的对象ol.Overlay用来实现弹出式窗口 // 创建地图 new ol.Map({ // 设置地图图层 layers: [ // 创建一个使用Open Street Map地图源的瓦片图层 new ol.layer.Tile({source: new ol.source.OSM()}) ],

原创 箭头函数

箭头函数：一种定义函数的方式1.定义函数的方式 ：const aaa = function （） {}2.对象字面量中定义函数const obj = {bbb: function () {},bbb() {}}3. es6中的箭头函数const ccc = (参数列表) => {}const ccc = () =>{}-箭头函数参数和返回值问题1.参数问题：1.1 放入两个参数const sum = (num1, num2) => {return

原创 vue5

一. 组件化开发1.1. 父子组件的访问children/refsparent/root1.2. slot的使用基本使用具名插槽编译的作用域作用域插槽二. 前端模块化2.1. 为什么要使用模块化简单写js代码带来的问题闭包引起代码不可复用.自己实现了简单的模块化AMD/CMD/CommonJS2.2. ES6中模块化的使用exportimport三. webpack3.1. 什么是webpackwebpack和gulp对比webpack依赖环境安

原创 vue组件。

1.创建组件构造器对象。 const cpnC = Vue.extend( { template:` <div> <h2>sssss</h2> <p>ssssssssssssss</p> <p>sssssssdsdsadsssssss</p> </div>` })es6中 ` 中可以装字符型东西并且可以换行。2.注册组件Vue.component('asd'

原创 vue

{{msg}} {{1 + 2}} {{msg + '----' + 123}}

原创 jq第三天

1.单个事件注册$（“ div”）.click( function () {$(this).css(“font-size”);})$（“ div”）.mouseover( function () {$(this).css(“backgroundColor”);})2.事件处理on（）绑定程序$(function() {// 1.点击发布按钮， 动态创建一个小li，放入文本框的内容和删除按钮， 并且添加到ul 中$(".btn").on(“click”,function() {var

原创 jq第二天

element.prop(“属性名”) 获取元素固有的属性值console.log($(“a”).prop(“href”));2.设置属性$(“a”).prop(“title”, “我们都挺好”);.元素的自定义属性 我们通过 attr()。// 3. 数据缓存 data() 这个里面的数据是存放在元素的内存里面("span").data("uname","andy");console.log(("span").data("uname", "andy"); consol...

原创 jq第一天。

jq对象和dom对象的不同点？DOM 对象： 用原生js获取过来的对象就是DOM对象jQuery对象： 用jquery方式获取过来的对象是jQuery对象。 本质：通过$把DOM元素进行了包装jq对象只能使用jq方法，dom对象只能使用原生的js属性和方法比如 ：jq中隐藏对象可以使用 $(this).hide();js中隐藏对象是通过改变对象的属性完成的this.style.display = ‘none’;jq和dom对象是可以互相转换的。因为原生js中的某些属性和方法jq并没有封