前端
文章平均质量分 57
前端
developer@liyong
GISer
展开
-
vue-历史模式部署
静态资源路径,路由路径和nginx Location的路径一定要保持一致。本项目采用nginx进行部署,历史模式的部署需要服务端的配合。原创 2023-11-27 13:36:40 · 201 阅读 · 0 评论 -
vue(透传属性,$attrs)
可以看到根元素就不会有两个属性了,但是无论这个参数是true还是false我们都可以通过$attrs来访问透视传递的属性。FirstLevel组件没有用props去申明name和age,所以这两个属性会透视传递。可见第二层组件也收到了透视属性,第三次亦是如此,原创 2023-01-16 19:55:57 · 732 阅读 · 0 评论 -
Promise(基础)
此部分需要多谢多练this . promiseState = "pending" this . promiseResult = null // 用于保存异步任务的回调函数 this . callbacks = [ ] // 这里需要注意this问题 // 可以先存下来self = this 后面用self替代this const self = this;// 保证状态只改变一次 if(self . promiseState!原创 2023-01-16 16:41:20 · 540 阅读 · 0 评论 -
react 基础
这个x的值只会在第一次初始化的时候才会被赋值为父组件的this.props.x后面父组件的值发生变化不会影响这个x的值,如果我们想要改变父组件的值子组件发生变化可以将父组件的state传递给子组件,后续都通过this.state.props.state来操作,其实本质就是和父组件共享一份数据。如果要实现,兄弟组件之间的传值,我们需要将数据放到最近的公共父节点里面。但是这样的话在页面渲染的时候会多一个div标签,如果我们不想这样多加一个冗余的标签则可以使用React.Fragment代替。原创 2022-12-20 20:07:37 · 328 阅读 · 0 评论 -
Node 基础
托管多个静态资源目录,多次调用app.use(express.static(“./static”))即可,他会按照目录的加载顺序查找所需的文件。express.json()解析JSON格式的请求体数据(在4.16.0+的版本可用);用于创建web服务器的模块,通过http模块提供的http.createServer()方法,就能方便的把一台普通的电脑,变成一台web服务器,从而对外提供web资源服务。通过app.use(),app.get(), app.post()绑定到app实例上。原创 2022-11-07 19:55:53 · 321 阅读 · 0 评论 -
Vue(生命周期)
生命周期其实就是一系列的函数,在DOM创建到销毁的过程由VUE调用,因此我们在这些函数中定义一些自己的逻辑。来源于尚硅谷视频教学特别注意:在beforemout中所有的dom操作都不生效,因为在后面的流程中是直接将虚拟DOM,转换为真实DOM挂载到页面。销毁函数this.$destroy,销毁后vm不在工作了,所有的指令,watcher事件(自定义事件,原生的dom事件还是会在)不再生效。...原创 2022-06-27 20:35:46 · 117 阅读 · 0 评论 -
Vue(动态代理)
vue动态代理原理(基础理解)原创 2022-06-12 13:32:04 · 591 阅读 · 0 评论 -
内联元素与块元素(inline,block,inline-block)
概念内联元素内联元素又叫行内元素,顾明思义,内联元素(inline element)不占据一整行,大小随内容而定,不可以设置宽度,也不可以设置高度,其宽度随着内容增加,高度随字体大小而改变。内联元素可以设置外边界,但外边界不对上下起作用,只能对左右起作用。常见的内联元素span、em、a等。块级元素块级元素(block element)生成一个元素框,(默认地)它会填充其父级元素的内容,旁边不能有其他元素,它在元素框之前和之后生成了“分隔”符。块级元素总是在新行上开始并占据一整行,宽度和高度原创 2022-05-18 21:01:02 · 438 阅读 · 0 评论 -
路由的使用
路由的本质就是一组一组的键值对,可以根据路径渲染组件。Vue的使用一级路由// 配置路由export default new VueRouter({ routes: [ { path: "/about", component: About }, { path: "/home", component: HomeH } ]<router-link class=原创 2022-05-17 21:01:31 · 221 阅读 · 0 评论 -
Vue基础(ref, props, mixin)
ref 属性它的作用是给DOM元素加上标签便于VUE来操作DOM元素。<h1 ref="demo">test</h1>// 获取对应的domlet dom = this.$refs.demo;console.log(dom);如果我们给组件加上ref标签 <School ref="sc"></School>我们拿到的是组件的实例对象vcprops属性 <Student sex="zs" age="18"></Stude原创 2022-05-16 21:04:23 · 243 阅读 · 0 评论 -
Vuex 基础
Vuex实现任意组件的通信。原理图:其中数据存储在state对象中, 执行流程先调用dispatch方法调用actions中的方法,在actions调用mutations的方法提交操作,state中的数据变化,然后重新渲染。原创 2022-05-15 16:15:02 · 195 阅读 · 0 评论 -
Vue resource
使用步骤安装npm i vue-resource使用//发送get请求this.$http.get('/try/ajax/ajax_info.txt').then(function(res){ // 成功的回调 console.log('请求成功出处理'); },function(){ // 失败的回调 console.log('请求失败处理');});更多使用方法:https://www.runoob.com/vue2/vuejs-ajax.html.原创 2022-05-15 14:27:46 · 95 阅读 · 0 评论 -
Vue(全局事件总线)
前置知识全局事件总线的作用:实现组件之间的通信,在A组件绑定事件(绑定的时候携带组件A的数据)在B组件调用。所以的事件都注册在EventBus中,供组件使用。创建全局事件总线:第一种写法,不推荐const VC = Vue.extend();const bus = new VC();Vue.prototype.$bus = bus;最终写法:new Vue({ beforeCreate() { Vue.prototype.$bus = this }}).$mount('原创 2022-05-15 14:11:38 · 263 阅读 · 0 评论 -
Vue(默认插槽,具名插槽,作用域插槽)
1.默认插槽<Category> <div>在组建标签中使用</div> </Category><template> <div> <!-- 定义插槽 --> <slot>在对应的组件中进行展示</slot> </div></template>这个过程就相当在组件内部留个位置等到使用组件的时候填上。2.具名插槽&原创 2022-04-19 15:20:10 · 98 阅读 · 0 评论 -
防抖与节流
用户操作非常快速,浏览器来不及反应会出现卡顿。lodash插件处理防抖和节流官方地址:https://www.lodashjs.com/docs/lodash.debouncehttps://www.lodashjs.com/docs/lodash.throttle防抖前面的所有触发都被取消,最后一次执行才会触发。_.debounce()函数节流在规定的时间范围内不会频繁的触发,在一定的间隔时间范围内才会触发。_.throttle函数...原创 2022-04-17 16:52:01 · 162 阅读 · 0 评论 -
axios二次封装
为什么二次封装?请求拦截器,响应拦截器,请求拦截器,可以再请求发送之前处理一些业务,响应拦截器,当侮辱器数据返回后,可以处理一些import axios from "axios"export default axios;const request = axios.create({ // 基础路径 baseURL: "/api", timeout: 5000})// 请求拦截器,在发送请求直接,请求拦截器可以检测到,可以再请求发送之前做一些事情request.interc原创 2022-04-17 14:35:55 · 806 阅读 · 0 评论 -
VUE(路由传参)
路由传参路由的跳转有两种方式申明式导航编程式导航路由传参的写法params参数:属于路径中的一部分,需要注意,在配置路由的时候需要要占位query参数:不属于路径中的一部分,类似于ajax的queryString /home?k=v&k=v,不需要占位{ path : "/search/:keyword", component : Search, meta : {show:true}, name : "search"}//第一种方式,直接写字原创 2022-04-13 14:21:09 · 127 阅读 · 0 评论 -
Cookie&Session
cookie概念-是一种服务器通知客户端保存键值的一种技术。-客户端有了cookie后每次请求都发送给服务器-每个cookie的大小不能超过4kbcookie操作a.获取cookie// 创建cookie,可以多个Cookie cookie = new Cookie("key","value");// 通知客户端保存cookieresp.addCookie(cookie);b.服务端获取cookie Cookie[] cookies = req.getCookies(); for原创 2020-11-17 23:18:03 · 79 阅读 · 0 评论 -
AJAX初识
Ajax1.发送异步请求,无刷新获取数据,实现懒加载。2.服务器端通常接收如下三种数据格式-xmljsonhtml可以通过ajax请求传输Ajax前置知识1.http超文本传输协议a.请求报文格式与参数-行 GET /s?id=utf-8 HTTP/1.1-头 参数-空行-体……b.响应报文-行 GET 200 OK HTTP/1.1-头 参数-空行-体……注解:可以观察浏览器network处的请求Ajax发送请求XMLHttp原创 2020-11-15 14:25:17 · 120 阅读 · 0 评论