爱睡的虫虫

vue wath 修改 data中的值

这里写自定义目录标题功能快捷键笔记网站：合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入功能快捷键撤销：Ctrl/Command + Z重做：Ctrl/Command + Y加粗：Ctrl/Command + B斜体：Ctrl/Co

关于vue中的@keyup.enter键盘事件无法生效的解决办法。

<p @click = “clickfun($event)”>点击</p>methods: {clickfun(e) {// e.target 是你当前点击的元素// e.currentTarget 是你绑定事件的元素 #获得点击元素的前一个元素 e.currentTarget.previousElementSibling.innerHTML #获得点击元素的第一个子元素 e.currentTarget.firstElementChild.

用通过「axios-mock-adapter」插件来模拟前端请求数据。1、安装npm i -D axios axios-mock-adapter打开目录，在「main.js」中引入「axios」，我们用它来请求资源。import axios from 'axios' // 同时设置全局 $axios 对象，这样就不用多次引用 axios 了 Vue.prototype.$axios = axios2、在 src 目录下新建 mock 目录，然后新建 index.js 和 servic

vue中如果需要引入外部js文件，避免被打包我们可以放到public文件下：在 public 下新建文件夹 json 中有 xmlList.js 文件此时xmlList就不会被打包编译。在组件中使用数据在html文件中引入<script src="json/xmlList.js"></script>xmlList.jslet xmlList = [ {"name":"姓名一","url":"www.abc.com"}, {"name":"姓名二","url":

Vue 项目里戳中你痛点的问题及解决办法（更新）https://juejin.cn/post/6844903632815521799

回归正题，我们所要的说的axios的封装和api接口的统一管理，其实主要目的就是在帮助我们简化代码和利于后期的更新维护。一、axios的封装在vue项目中，和后台交互获取数据这块，我们通常使用的是axios库，它是基于promise的http库，可运行在浏览器端和node.js中。他有很多优秀的特性，例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。所以我们的尤大大也是果断放弃了对其官方库vue-resource的维护，直接推荐我们使用axios库。如果还对axios不了解的，可以移步ax

为祖国的复习而读书！—— 非凡主力Web开发构建工具，它是一个基于浏览器原生ES模块导入的开发服务器，在开发环境下，利用浏览器去解析import，在服务器端按需编译返回，完全跳过了打包这个概念，服务器随启随用。同时不仅对Vue文件提供了支持，还支持热更新，而且热更新的速度不会随着模块增多而变慢。在生产环境下使用Rollup打包。Vite具有以下特点： 快速的冷启动 即时热模块更新（HMR，Hot Module Replacement） 真正按需编译 Vite是在推出Vue 3的时候开发的，

//params形式：参数不显示在地址栏this.$router.push({ name: 'details', params: { userId: this.num }})//获取console.log(this.$route.params.userId);//query形式：参数显示在地址栏this.$router.push({ path: 'deta

先说说在vue中如何引用swiper1.npm命令安装swipernpm install swiper --save-dev2.在需要用到swiper插件的组件中引入swiper<script>import Swiper from "swiper";</script><style lang="scss" scoped>@import "../....

一级路由<template> <div id="app"> <div> <router-link to="/Home">Home</router-link>| <router-link to="/about">About</router-link> </div&g...

1.使用我们定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:npm install -g cnpm --registry=https://registry.npm.taobao.org2.把npm的register给永久设置过来就好了，这样使用cnpm或者npm就没差别了。（可选可不选）npm config set registry https://regist...

引入：npm i lib-flexible -Snpm i postcss-pxtorem -Dmain.jsimport "lib-flexible/flexible";项目根目录下创建：postcss.config.js//postcss.config.jsmodule.exports = { plugins: { auto...

在vue中使用 // 安装 npm install fastclick -S // 引入 main.js 中 import FastClick from 'fastclick' // 使用 FastClick.attach(document.body);

keep-aliveProps：include - 字符串或正则表达式。只有名称匹配的组件会被缓存。exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存。max - 数字。最多可以缓存多少组件实例。用法： 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 相似， 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在组件的父组件链中。当组件在 ...

组件分类：全局组件 局部组件​ 全局组件在任何地方都可以使用​ 局部组件只能在当前实例里用全局组件Vue.component("组件名称",{​ data(){​ return {​ msg:"123"​ }​ },​ methods:{​ fn()...

vue.config.js配置文件在使用vue-cli3创建项目后，因为webpack的配置均被隐藏了，当你需要覆盖原有的配置时，则需要在项目的根目录下，新建vue.config.js文件，来配置新的配置。const url = require('url');const queryString = require('querystring');const path = require...

v-model表单控件在实际业务较为常见，比如单选、多选、下拉、输入框等，用它们可以完成数据的录入，校验，提交等。例如在输入框上使用时，输入的内容会实时映射到绑定的数据上。使用v-model 后，表单控件显示的值只依赖所绑定的数据，不再关心初始化时的value属性的值。使用v-model...

vue的计算属性computed和侦听器watch都是监听数据变化。computed （计算）其在vue单文件组件中就是对数据进行简单的一些逻辑计算，在项目开发中方便我们对原始数据处理。重要的是计算属性基于它的响应式依赖进行缓存的。只有当响应依赖关系变了即值发生变化了才会重新计算。否则，直接利用缓存，这样既避免多次调用函数又提升性能。<div id="app"> {{txt}}...

生命周期1.vue的生命周期是什么 ?2.vue生命周期的在项目中的执行顺序3.vue中内置的方法 属性和vue生命周期的运行顺序（data、methods、computed、watch）4.自己构造的方法与vue生命周期的运行顺序5.总结一、vue的生命周期是什么​ vue每个组件都是独立的，每个组件都有一个属于它的生命周期，从一个组件创建、数据初始化、挂载、更新、销毁，这就...

认识vue.jsvue 是什么官方文档：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。如果你想在深入学习 Vue 之...

npm是什么NPM的全称是Node Package Manager，是随同NodeJS一起安装的包管理和分发工具，它很方便让JavaScript开发者下载、安装、上传以及管理已经安装的包。npm通常是和node.js一起安装的npm，node package manager，是 Node 的模块管理器，功能极其强大。它是 Node 获得成功的重要原因之一。随着一系列基于node...

封装的better-scroll组件&lt;template&gt; &lt;div&gt; &lt;div class="list-wrapper" ref="wrapper"&gt; &lt;div class="bscroll-container"&gt; &lt;!-- 刷新提示信息 --

假如你在循环输出列表的时候{{for item in post_list}} 的到的列表 当你在具体的地方使用方法时<div @click="someFun(item)"></div>在你的methods里的方法就可以这样写someFun({hc_id}){ console.log("hc_id")}上面的hc_id就是对应条目的hc_id,在方法里就可以直接使用了

Vue Croppa https://zhanziyang.github.io/vue-croppa/#/

.vue文件中监听input的输入值变化事件。 需求是这页面中，改变input的值，就调用一个事件， 第一想到的是oninput。 但是在.vue中这样写是没有作用的：&lt;input type="text" id="cardsNum2" value="1" @oninput ="inputFunc"&gt;&lt;input type="text" id=&qu

安装只用安装一个axios就可以了。 npm install axios –save 接口代理设置//文件位置：config/index.jsproxyTable: { '/api': { target: 'http://47.95.xxx.246:8080', // 通过本地服务器将你的请求转发到这个地址 changeOrigin: true...

https://github.com/Dafrok/vue-iscroll-view 基本使用方法：$ npm i vue-iscroll-view --save-dev$ npm i iscroll --save-devimport IScrollView from 'vue-iscroll-view'/* Using these kinds of IScroll cl...

npm install 在安装 npm 包时，有两种命令参数可以把它们的信息写入 package.json 文件 一个是 --save // 运行依赖（发布）另一个是–save-dev //开发依赖（辅助）区别是它们会把依赖包添加到package.json 文件–save ： dependencies 键下，发布后还需要依赖的模块，譬如像jQuery库或者Angular框架类似的，我们在开发完

图片懒加载 vue-lazyload： https://github.com/hilongjw/vue-lazyload

获取元素

HTML： &lt;div id=&quot;example&quot;&gt; &lt;button @click=&quot;send&quot;&gt; &lt;span v-if=&quot;sendMsgDisabled&quot;&gt;{{time+'秒后获取'}}&lt;/span&gt; &lt;span v-if=&quot;!s

用于标记往插槽中插入子组件内容。 主要是让组件的可扩展性更强。1、使用匿名slot//定义组件（子）my-component<div> <slot></slot></div>//使用方法<my-component> <p>我就是子组件slot替代的内容</p></my-component>2、 给slot加个名字//定义组件（子）my-component<div>

HTML:&amp;lt;button type=&amp;quot;button&amp;quot; @click=&amp;quot;a();b()&amp;quot;&amp;gt;按钮&amp;lt;/button&amp;gt;JS:methods:{ a(){ console.log('a'); }, b(){ console.log('b'); }}

父---》子使用绑定标签属性的方法给子组件进行绑定,在子组件内部通过props数组的方式来接受数据，接收之后就可以使用。 (1)父组件在给子组件绑定标签属性来传递数据的时候，key值可以有-，但是在子组件的props里我们要写成小驼峰的写法 (2)父组件可以将自己动态的数据传递给子组件，当父组件的数据发生改变，子组件收到的数据也发生改变 (3)父组件给子组件传递数据的...

this.$router.push({path: '/home', replace: true})//如果是声明式就是像下面这样写：// 编程式:router.replace(...)http://www.jianshu.com/p/ee7ff3d1d93drouter.push(location)除了使用 创建 a 标签来定义导航链接，我们还可以

一、配置 Router用 vue-cli 创建的初始模板里面，并没有 vue-router，需要通过 npm 安装 cnpm i vue-router -D 安装完成后，在 src 文件夹下，创建一个 routers.js 文件，和 main.js 平级然后在 router.js 中引入所需的组件，创建 routers 对象import Home from './components

组件使用组件必须先实例化对象 new Vue({ el: "#app-01", data:{ message: "Hello World Vue.js!" //不能带分号!!! } })模板指令模板指令html和vue对象粘合数据渲染 v-text == {{mes}} //文本插值 v-on

不需要vue-cli 脚手架搭建，只写一个*.vue文件就可以通过vue build 命令启动，非常合适想写一点Vue的dom或小型项目。 要求vue-cli 更新到2.8.0+命令： vue build app.vue启动时关闭其它运行的命令窗口