tyoubinn的博客

Axios 如果发送Post请求，并且带上请求参数时，会一直报请求超时，如下// src/api/test.jsimport request from '@/utils/request'export default { test () { return request({ url: '/test', method: 'post', data: { "name": "张三" } }) }}这个问题是因为mo

在 vue.config.js 文件中使用 devServer.proxy 选项进行代理配置devServer: { // ... before: require('./mock/mock-server.js'), // 开发环境代理配置 解决跨域问题 proxy: { [process.env.VUE_APP_BASE_API]: { // 是.env.development 文件的 /dev-api target: ' https://w.

1. vuex 是什么？怎么使用？哪些功能场景使用它？答：vue框架中状态管理。在 main.js 引入 store，注入。新建了一个目录store.js，…export。场景有：单页应用中，组件之间的状态。音乐播放、登陆状态、加入购物车2.vuex有哪几种属性？答：有五种，分别是 State、Getter、Mutation、Action、Modulestate => 基本数据（数据源存放地）getters => 从基本数据派生出来的数据mutations => 体积更改数

1. mvvm框架是什么？答：vue是实现了双向数据绑定的mvvm框架，当视图改变更新模型层，当模型层改变更新视图层。在vue中，使用了双向数据绑定技术，就说View的变化能实时让Model发生变化，而Model的变化也能实时更新到View。2.vue-router是什么？它有哪些组件？答：vue用来写路由的一个插件。router-link、router-view3.active-class是哪个组件的属性？答：vue-router模块的router-link组件。children数组用来定义子路

1. 什么是 vue 生命周期？有什么作用？答：每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做 生命周期钩子的函数，这给了用户在不同阶段添加自己代码的机会。（生命周期钩子就说生命周期函数）例如，如果要通过某些插件操作 DOM 节点，如想在页面渲染完后弹出广告窗，那我们最早可在mounted中进行。2. 第一次页面加载会触发哪几个钩子？答：beforeCreate，crea

1.vue 优点答：轻量级框架：只关注视图层，是一个构建数据的视图集合，大小只有几十kb； 简单易学：国人开发，中文文档，不存在语言障碍 ，易于理解和学习；双向数据绑定：保留了angular的特点，在数据操作方面更为简单；组件化：保留了react的优点，实现了html的封装和重用，在构建单页面应用方面有着独特的优势；视图，数据，结构分离：使数据的更改更为简单，不需要进行逻辑代码的修改，只需要操作数据就能完成相关操作；虚拟DOM：dom操作是非常耗费性能的， 不再使用原生的dom操作节点，极大解

Vue中内置了很多的指令，如v-model、v-show、v-html等，但是有时候这些指令并不能满足我们，或者说我们想为元素附加一些特别的功能，这时候，我们就需要用到vue中一个很强大的功能了—自定义指令。在开始之前，我们需要明确一点，自定义指令解决的问题或者说使用场景是对普通 DOM 元素进行底层操作，所以我们不能盲目的胡乱的使用自定义指令。1. 注册假设我们需要自定义一个 v-focus 指令，即在 或 标签初始化时获得焦点。注册自定义指令分为全局注册与局部注册两种：全局注册：// 注

Vue包含两种观察数组的方法分别如下：1. 变异方法变异方法会改变被这些方法调用的原始数组，它们也将会触发视图更新，这些方法如下：push()pop()shift()unshift()splice()sort()reverse()2.非变异方法非变异方法与变异方法的区别就说，非变异方法不会改变原始数组，总书返回一个新数组，当使用非变异方法时，可以用新数组替换旧数组，非变异方法大致有：filter() , concat(), slice()arr = arr.filter(item

造成边框变粗的原因其实这个原因很简单，因为css中的1px并不等于移动设备的1px，这些由于不同的手机有不同的像素密度。在window对象中有一个devicePixelRatio属性，他可以反应css中的像素与设备的像素比。devicePixelRatio的官方的定义为：设备物理像素和设备独立像素的比例，也就是 devicePixelRatio = 物理像素 / 独立像素。1. 0.5px边框retina 屏的浏览器可能不认识0.5px的边框，将会把它解释成0px，没有边框。包括 iOS 7 和

方法一绝对定位方法：不确定当前div的宽度和高度，采用 transform: translate(-50%,-50%); 当前div的父级添加相对定位（position: relative;）<style> .container{ position: relative; } .inner{ position:absolute; left: 50%; top: 50%; transform: translate(-50% -50%); }</style>

一、常见定位方案我们先来了解一下常见的定位方案，定位方案是控制元素的布局，有三种常见方案：普通流(normal flow)在普通流中，元素按照其在HTNL中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染成完整的一个新行，除非另外指定，否则所有元素默认都是普通流定位，也可以说，普通流中元素的位置由该元素在HTML文档中的位置决定。浮动(float)在浮动布局中，元素首先按照普通流的位置出现，然后根据浮动的方向尽可能的向左边或者右边偏移

浏览器的运行机制：构建DOM树构建渲染树布局渲染树绘制渲染树重绘触发重绘的条件：改变元素外观属性。如：color background-color重排（重构/回流/reflow)元素的规模尺寸，布局，隐藏等属性改变时会触发重排，所以重排必定会引发重绘，但重绘不一定会引发重排。触发条件：页面渲染初始化添加或删除可见的DOM元素元素位置的改变，或者使用动画元素尺寸的改变——大小，外边距，边框浏览器窗口尺寸的变化（resize事件发生时）重绘重排的代价：耗时，导致浏览器卡慢

文章首发于@careteen/webpack-hmr目录HMR是什么使用场景配置使用HMR配置webpack解析webpack打包后的文件内容配置HMRHMR原理debug服务端源码服务端简易实现服务端调试阶段debug客户端源码客户端简易实现客户端调试阶段问题总结HMR是什么HMR即Hot Module Replacement是指当你对代码修改并保存后，webpack将会对代码进行重新打包，并将改动的模块发送到浏览器端，浏览器用新的模块替换掉

视频列表页<template> <view class="video_main"> <view class="video_item" v-for="item in list" :key="item.id" @click="handleGoVideo(item)" > <image mode="widthFix" :src="item.img" .

1. 可以将参数挂载到Vue.prototype上// main.js// Vue.prototype.baseURL = 'http://uniapp.dcloud.io' // 全局参数在 pages/index/index.vue 中调用<script> export default { onLoad(){ console.log(this.baseURL); } } </script&

使用到的 API 有 :uni.downloadFileuni.saveImageToPhotosAlbum<template> <view> <view class="download"> <view class="download_btn" @click="download" >下载图片</view> </view> </view>&

小程序原生api中没有封装手势滑动组件手势封装的思路给容器绑定两个触屏事件 touchstart 和 touchend用户按下屏幕事件按下时间: Date.now() 时间戳按下坐标: clientX 和 clientY用户离开屏幕事件离开时间: Date.now()离开坐标: clientX 和 clientY根据两个时间运算判断用户按下屏幕时长是否合法根据两对坐标判断距离是否合法 判断用户滑动方向<!-- demo.vue--><template>

以查看专辑详情为例：步骤在 src 根目录下新建 components目录，存放公共组件<!-- src/components/goDetail.vue --><template> <view @click="handleClick"> <slot></slot> <!-- 插槽占位 --> </view></template><script>export defau

官方地址： http://momentjs.cn/安装npm install moment --save引用import moment from 'moment'export default { data () { return { stime: 1584720182000 } }, mounted () { console.log(moment(this.stime).format('MM')) // 获取月份 console.log(

1. 安装npm install --save axios vue-axios2. 引入// main.jsimport Vue from 'vue'import router from './router'import App from './App.vue'import axios from 'axios' // 1. 引入// 2. 配置请求的根路径axios.defaults.baseURL = 'http://127.0.0.1:8888/api/'// 3. 通过axi