【vue使用facebooktwitter分享示例】教程文章相关的互联网学习教程文章

vue 项目获取QQ音乐歌单数据【代码】

1. 前端请求(recommend.js);import axios from ‘axios‘export function getDiscList() {const url = ‘/api/getDiscList‘const data = Object.assign({}, commonParams, {platform: ‘yqq‘,hostUin: 0,sin: 0,ein: 29,sortId: 5,needNewCode: 0,categoryId: 10000000,rnd: Math.random(),format: ‘json‘})return axios.get(url, {params: data}).then((res) => {return Promise.resolve(res.data)}) } 2. 手动代理请求(...

vue+大文件分片上传【图】

最近遇见一个需要上传百兆大文件的需求,调研了七牛和腾讯云的切片分段上传功能,因此在此整理前端大文件上传相关功能的实现。在某些业务中,大文件上传是一个比较重要的交互场景,如上传入库比较大的Excel表格数据、上传影音文件等。如果文件体积比较大,或者网络条件不好时,上传的时间会比较长(要传输更多的报文,丢包重传的概率也更大),用户不能刷新页面,只能耐心等待请求完成。下面从文件上传方式入手,整理大文件上传的思...

vue.js学习笔记

1、http://vuejs.org/2015/10/28/why-no-template-url/Why Vue.js doesn‘t support templateURL 原文:http://www.cnblogs.com/danghuijian/p/4993862.html

纯小白入手 vue3.0 CLI - 3.1 - 路由 ( router )【代码】

vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html尽量把纷繁的知识,肢解重组成为可以堆砌的知识。我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支。==========================经过几天的学习,组件的应用已入门。组件的内容还有很多:1、组件内部各类对象 ( $root $parent )、依赖注入、事件监听、循环引用、控制更新等。2、组件的混入、自定义指令、渲染函数与JSX、插...

vue+element-ui项目的分页, vue+element-ui项目的分页,返回当前页面取得总条数totalNum的之前,element-ui的分页组件已经在页面加载完毕,当时的totalNum绑定的是data里面初始化的数据0,所以当总条数为0的时候,分页组件的页码默认为1。

关于vue+element-ui项目的分页,返回默认显示第一页的问题解决https://blog.csdn.net/StephenO_o/article/details/84234916 问题造成原因我们返回当前页面取得总条数totalNum的之前,element-ui的分页组件已经在页面加载完毕,当时的totalNum绑定的是data里面初始化的数据0,所以当总条数为0的时候,分页组件的页码默认为1。并且当totalNum在created生命周期里取得数据后,分页组件也不会刷新。所以这就导致, 页面内容正确,但是页...

vue自定义指令v-focus失效之解决办法!【代码】【图】

注册组件代码如下: // 设置自定义指令v-focus directives: {// focus指令名称 focus: {inserted(el) {el.focus()},},}, 以上我是按照之前教学视频进行注册的自定义指令,但是失效。运行之后可以试着打印下el,看下值是什么:截图: 通过截图可以看到返回的值是div,我们所以el并不是input而是他的父标签div。所以我们只需用querySelector获取到input再绑定即可。代码:// 设置局部指令v-focus directives: {// focus指令名称...

安装(c)npm及搭建Vue项目详解【代码】【图】

【安装步骤】一、安装node.js(node-v12.16.1-x64.msi)1.前往node.js官网下载并安装工具,这里安装路径选到D盘,D:\Program Files\nodejs 安装完毕后在命令行输入以下命令测试是否安装成功,正确会出现版本号npm -v2.改变原有的环境变量, (1)配置npm的全局模块的存放路径以及cache的路径,例如两个文件夹放在NodeJS的主目录下,便在NodeJs下建立"node_global"及"node_cache"两个文件夹,输入以下命令改变npm配置npm config set ...

vue组件通信

第一种:props,$emit用于在父子组件之间进行传值,通信第二种:vuex父子组件,兄弟组件等组件之间的通信都可以使用第三种:$root.$on , $root.$emit深层组件嵌套时候可以使用另外还有好几种通信方式,我只记录我使用过的这几种 原文:https://www.cnblogs.com/sixrookie/p/13091797.html

关于VUE的安装和一些简单属性【代码】

安装vue安装前初始化package.json 主要用来描述自己的项目,记录安装过得文件有哪些,在当前文件夹下生产json安装vue --save(-S)代表项目依赖--save-dev(-D)代表开发依赖npm info vue npm install vue --save npm install //跑环境,将package中的依赖全部安装安装后默认会生产node_modules文件夹 上传到git上node_modules是忽略掉的,拉下代码后,需要重新npm install安装依赖Vue属性el 指定的元素不能是html和body使用querySelectorda...

解决vue项目中使用/deep/报错

方法:降低sass-loader版本1.卸载当前项目中的sass-loadernpm uninstall sass-loader2.安装低版本sass-loadernpm install sass-loader@7.0.03.安装node-sassnpm install node-sass安装node-sass是因为安装低版本sass-loader需要引入node-sass依赖来支持,不然会报错 原文:https://www.cnblogs.com/xiaobaibubai/p/14776828.html

添加谷歌拓展程序 vue.js devtools过程中的问题【图】

在用vue做项目过程中,需要用到vue.js devtools,在从github上面clone下来代码,然后再npm install ,过程报错,然后更新npm包也是会有问题,以下是install的问题,npm cache clean --force 也是没用的,好在最后问同事,windows版本蓝灯下载重装,最后再谷歌应用商店添加了拓展程序。从昨天到今天上午,至此这个问题才搞定,用这个工具主要是为了方便整个项目 vuex的状态查看。 原文:https://www.cnblogs.com/tangjiao/p/9013281....

vue中rem的转换【代码】

1function rems(doc: any, win: any): void {2 let docEl = doc.documentElement,3 resizeEvt = ‘orientationchange‘ in window ? ‘orientationchange‘ : ‘resize‘,4 recalc = function () {5 let clientWidth = docEl.clientWidth;6if (!clientWidth) return;7 docEl.style.fontSize = 20 * (clientWidth / 750) + ‘px‘;8 };9if (!doc.addEventListener) return; 10 win.addEventListener(res...

第一个vue程序【代码】

前置:nodejs vue-cli  初始化一个vue程序vue init webpack vuetest因为是第一个vue程序,所以全部手动创建  Vue bulid sandalone 运行时编译  是否安装Vue-router 不安装,手动安装  是否使用ESL检查你的代码 不  是否安装测试 NO  是否需要自动运行npm install No 手动 基础的vue目录   进入到新建的vue文件   npm install安装package.json里面的文件  报错的话比如typeerror可以试试cnpm i...

Vue中table合并单元格用法【代码】

<table><tr><th>地名</th><th>结果</th><th>人名</th><th>性别</th></tr><template v-for="(item, index) in list"><tr :key="index"><td :rowspan="item.groups.length">{{item.name}}</td><td :rowspan="item.groups.length" v-if="item.result === ‘1‘"><span>已完成</span></td><td :rowspan="item.groups.length" v-if="item.result === ‘0‘ || item.result === null"><span>未完成</span> </td><td>{{item.gr...

使用vue-cli构建 webpack打包工具时,生产环境下,每次build时,删除dist目录,并重新生成,以防dist目录文件越来越多。

首先,需要使用webpack的插件CleanWebpackPlugin,安装命令如下:  npm install --save-dev clean-webpack-plugin  其次,需要在生产环境提供的文件:build/webpack.prod.conf.js的plugins节点下添加如下代码:  new CleanWebpackPlugin(  [‘dist‘],  //匹配删除的文件  {      root:path.resolve(__dirname,‘../‘) //根目录    verbose:true, //是否启用控制台输...