自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 资源 (4)
  • 收藏
  • 关注

原创 vue.js实现搜索框搜索功能

一、布局(基于html、css、vue.js)1、搜索框:(1)、template部分<template><div> <div class="search"> <input v-model="keyword" type="text" class="searchInput" placeholder="搜索城市 "> </div></div></template> (2)

2020-08-26 22:45:27 12361

原创 求助help

meteor create创建项目报错,meteor-tool也尝试重装了,没有用。有没有哪位大佬帮忙答疑解惑。

2022-08-16 11:22:16 172

转载 JS几大常用的包管理工具对比:NPM、NRM、CNPM、YARN

一.什么是包?在模块化开发中, 在一个模块(一个文件中)尽量只完成一个特定的功能但是有些比较复杂的功能可能需要由多个模块组成,例如: jQuery选择器相关的代码在A模块, CSS相关的代码在B模块, …我们需要把这些模块组合在一起才是完成的jQuery那么这个时候我们就需要一个东西来维护多个模块之间的关系这个维护多个模块之间关系的东西就是"包"简而言之: 一个模块是一个单独的文件, 一个包中可以有一个或多个模块二.JS包的管理在NodeJS中为了方便开发人员发布、安装和管理包, Node

2020-11-16 21:50:01 1036

原创 关于vue-quill-editor样式失效问题

在使用vue-quill-editor的时候,遇到前四个功能全失效的情况,即加粗、倾斜、下划线、删除线失效,其原因其实是全局css,我的reset.css是设置了strong(加粗)、em(倾斜)、u(下划线)、s(删除线)默认样式,导致失效,只要对全局css做修改即可。其他样式失效也可能是这个原因,可作为参考,如代码块没有背景色,在全局css对pre添加背景色即可。...

2020-10-09 21:50:38 3153 3

原创 vue-quill-editor代码块高亮问题

vue-quill-editor默认代码块没有高亮效果,如图:而没有高亮区别显示的代码是没有灵魂的,接下来呢,引入highlight.js使代码高亮,有关highlight.js,可浏览 highlight.js官网首先,依然是安装与引入1、安装npm install highlight.js 2、引入在需要的组件引入import hljs from 'highlight.js'在需要的组件引入或在main.js全局引入代码高亮样式,我选的是dracula.css,还有许多其他样式

2020-10-09 21:48:47 2225

原创 vue-quill-editor快速使用

第一步1、首先当然是安装vue-quill-editor包npm 安装 vue-quill-editornpm install vue-quill-editor --save2、常规操作,接下来向Vue项目里引入vue-quill-editor在main.js里引入vue-quill-editor和样式import VueQuillEditor from 'vue-quill-editor'import 'quill/dist/quill.core.css'import 'quill/di

2020-10-09 21:41:23 497

原创 git提示this.$message is not a function怎么办?

在vue文件里找到main.js组件,加上以下代码,重新运行即可:import ElementUI from 'element-ui'Vue.use(ElementUI)

2020-08-27 17:48:33 499

原创 电脑上找不到命令提示符怎么办?

方法一:输入win+r弹出运行界面,在搜索框输入cmd,回车即可方法二:win+x找到Windows PowerShell(管理员 (A)

2020-08-27 17:45:54 2484

原创 如何优雅解决单行溢出隐藏和多行溢出隐藏

1、单行溢出隐藏: overflow: hidden; text-overflow: ellipsis;//多出部分以省略号形式隐藏 white-space: nowrap;/* 禁止换行 normal可以换行 */text-overflow: ellipsis;多出部分以省略号形式隐藏,还可以有其他形式隐藏,如clip,自定义string,可参考溢出隐藏2、多行溢出隐藏:display: -webkit-box; word-break: break-all;-webkit

2020-08-27 17:36:39 2292

原创 vue.js解析lrc格式歌词文件

效果图如下:1、布局部分(1)、template部分<div class="detail"> <div class="song-title"> <p ref="song">{{song}}</p> <p ref="singer">{{singer}}</p> </div> <div class="wrapper"> &lt

2020-08-27 17:05:22 1860 2

原创 vue.js实现点击单句歌词播放

所实现的功能是:点击单句歌词后,对本句进行播放,并且高亮显示,相应的进度条到达一定的位置。可参考vue.js歌曲播放进度条与歌词滚动同步 ,和vue.js实现歌词高亮滚动与播放同步。效果图:1、布局部分(1)、template部分<audio ref="player" autoplay ></audio>//歌词<div class="detail"> <div class="song-title"> <p ref="song

2020-08-27 17:05:02 515

原创 vue.js歌曲播放进度条与歌词滚动同步

实现的是拖动或点击进度条,歌词随之滚动到指定位置,做到与歌曲播放同步。进度条可参考vue.js实现歌曲播放进度条 ,歌词滚动可参考 vue.js实现歌词高亮滚动与播放同步效果图: vue.js歌曲播放进度条与歌词滚动绑定 1、布局部分(1)、template部分<audio ref="player" autoplay ></audio>//歌词部分&

2020-08-27 16:50:13 3003 1

原创 vue.js实现歌词高亮滚动与播放同步

按照惯例,先上效果图:1、布局部分(1)、template部分<audio ref="player" autoplay ></audio><div class="detail"> <div class="song-title"> <p ref="song">歌名</p> <p ref="singer">歌手</p> </div> <div class="w

2020-08-27 16:43:43 2997 8

原创 vue.js实现点击、拖动进度条播放歌曲事件

进度条可参考本人已写的进度条链接:效果图: vue.js实现点击、拖动进度条播放歌曲事件 进度条:<audio ref="player" autoplay ></audio><div class="bar"> <div class="progressbar" @click="playMusic" ref="runfatbar"&g

2020-08-27 16:37:09 1441 2

原创 vue.js实现歌曲播放进度条

进度条效果图:1、template布局部分:<audio ref="player" autoplay ></audio>//进度条<div class="bar"> <div class="progressbar" @click="playMusic" ref="runfatbar"> <div class="greenbar" ref="runbar"> <span class="yuan">&lt

2020-08-27 16:36:15 2142 5

原创 vue.js实现返回顶部功能

通常类似淘宝下拉表单界面都非常长,再通过手动上拉返回顶部就非常麻烦,所以可以做个类似淘宝的返回顶部的箭头按钮。效果图:当下拉至一定高度,返回顶部图标便会出现,点击返回顶部箭头按钮后,实现自动平缓上拉,类似于better-scroll。 vue.js实现返回顶部箭头的出现与隐藏 1、template布局部分<div class="goTop iconfont" title="

2020-08-27 16:20:42 980 1

原创 vue使用vue-seamless-scroll实现上下自动滚动

效果图: vue使用vue-seamless-scroll实现上下自动滚动 一、使用:1、安装vue-seamless-scrollnpm install vue-seamless-scroll --save2、在组件引入vue-seamless-scrollimport vueSeamlessScroll from 'vue-seamless-scroll'compone

2020-08-26 18:50:15 2209

原创 vue实现全局数据传输

vue中的数据传输大致分为三种:父组件向子组件传递数据、子组件向父组件传递数据、和非父子关系的组件之间的数据传递。在这里所要讲的是没有父子关系的组件之间的数据传递,用传统的ajax实现较为麻烦。所以采用eventBus总线传递数据。eventBus原理可参考eventBus一、使用:1、首先,在static路径下创建个js文件夹,里面创建一个eventBus.js文件import Vue from 'vue'export const EventBus = new Vue()2、在需要的两个组

2020-08-26 18:25:17 833

原创 vue.js使用vue-awesome-swiper实现轮播图

先放效果图:参考swiper介绍

2020-08-26 18:00:21 468

原创 vue.js使用better-scroll实现滚动

better-scroll是一个页面滚动插件,通常在子容器高度超过固定的父容器高度时使用。一、适用的页面结构:<div ref="wrapper" class="wrapper"> <ul class="content"> <li v-for="(item,index) of ms" :key=item.index>{{item.c}}</li> </ul></div>注意:父容器固定高度,并设置ove

2020-08-26 17:22:31 491

React所需的三个js文件3--babel.min.js.zip

React所需的三个js文件之3--babel.min.js.zip,此为压缩文件,需要解压使用。在HTML文件的head引入script即可使用。

2020-11-24

React.js所需三个js文件2--react-dom.development.v17.js

React.js所需三个js文件之2--react-dom.development.v17.js,在head引入script即可使用。

2020-11-24

React.js所需的三个js文件1--react.development.v17.js

React.js所需的三个js文件之1--react.development.v17.js,在head引入script即可使用。

2020-11-24

所有数据类型与其对应的响应头json文件

所有数据类型与其对应的响应头json文件。 注意:text类型数据,为防止乱码,响应头需添加";charset=utf-8;"

2020-11-18

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除