parseLyric(lyric) {
      var lines = lyric.split(/\n/); //使用/n换行,将数据切成一个数组
      var getLtricTime = /\[\d{2}:\d{2}.\d{2}\]/g;
      var arr = [];
      while (!getLtricTime.test(lines[0])) {
        lines = lines.splice(1);
      }
      if (lines[lines.length - 1].length == 0) {
        lines.pop();
      }
      lines.forEach(item => {
        var index = item.indexOf("]");
        var time = item.substr(1, index - 1);
        var timeArr = time.split(":");
        var geci = item.substr(index + 1);
        arr.push([timeArr[0] * 60 + parseFloat(timeArr[1]), geci]);
      });
      console.log(arr);
      arr.sort(function(a, b) {
        return a[0] - b[0];
      });
      return arr;
    }

Vue分割音乐歌词数据函数的更多相关文章

  1. 一篇文章带你用Python网络爬虫实现网易云音乐歌词抓取

    前几天小编给大家分享了数据可视化分析,在文尾提及了网易云音乐歌词爬取,今天小编给大家分享网易云音乐歌词爬取方法. 本文的总体思路如下: 找到正确的URL,获取源码: 利用bs4解析源码,获取歌曲名和歌 ...

  2. Vuejs——(2)Vue生命周期,数据,手动挂载,指令,过滤器

    (八)传入的数据绑定 先创建一个对象(假如是obj),然后将他传入Vue实例中,作为data属性的值,那么 ①obj的值的变化,将影响Vue实例中的值的变化: ②相反一样: ③可以在Vue实例外面操纵 ...

  3. Vue实例对象的数据选项

    前面的话 一般地,当模板内容较简单时,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项 data ...

  4. Vue源码后记-钩子函数

    vue源码的马拉松跑完了,可以放松一下写点小东西,其实源码讲20节都讲不完,跳了好多地方. 本人技术有限,无法跟大神一样,模拟vue手把手搭建一个MVVM框架,然后再分析原理,只能以门外汉的姿态简单过 ...

  5. 理解Vue中的Render渲染函数

    理解Vue中的Render渲染函数 VUE一般使用template来创建HTML,然后在有的时候,我们需要使用javascript来创建html,这时候我们需要使用render函数.比如如下我想要实现 ...

  6. Vue基础进阶 之 Vue生命周期与钩子函数

    Vue生命周期 Vue生命周期:Vue实例从创建到销毁的过程,称为Vue的生命周期: Vue生命周期示意图:https://cn.vuejs.org/v2/guide/instance.html#生命 ...

  7. Vue实例对象的数据选项(火柴)

    前言 一般地,当模板内容比较简单的时候,使用data选项配合表达式即可.涉及到复杂逻辑时,则需要用到methods.computed.watch等方法.本文将详细介绍Vue实例对象的数据选项. dat ...

  8. Vue框架核心之数据劫持

    本文来自网易云社区. 前瞻 当前前端界空前繁荣,各种框架横空出世,包括各类mvvm框架横行霸道,比如Angular.Regular.Vue.React等等,它们最大的优点就是可以实现数据绑定,再也不需 ...

  9. iOS 开发仿网易云音乐歌词海报

    使用网易云音乐也是一个巧合,我之前一直使用QQ音乐听歌,前几天下 app 手机内存告急.于是就把QQ音乐给卸载掉了,正好晚上朋友圈里有一个朋友用网易云音乐分享了一首歌曲,于是我也就尝试下载了网易云音乐 ...

随机推荐

  1. swiper 的左右箭头放到轮播外面

    <!-- 增加一个father的包裹 --> <div class="swiper-father"> <div class="swiper- ...

  2. database使用

    参照文档 https://www.cnblogs.com/laoqing/p/8542487.html

  3. 关于JS的prototype详解

    JavaScript面向对象 构造函数和原型链 首先,我们要先了解一下类的概念,JavaScript 本身是一种面向对象的语言,它所涉及的元素根据其属性的不同都依附于某一个特定的类.我们所常见的类包括 ...

  4. flum到kafka 收集数据 存储到redis 案例 (ip.txt)

    ip.scala package ip import org.apache.kafka.clients.consumer.ConsumerRecord import org.apache.kafka. ...

  5. Lombok的用法

    Lombok是一款Java开发插件,使得Java开发者可以通过其定义的一些注解来消除业务工程中冗长和繁琐的代码,尤其对于简单的Java模型对象(POJO).在开发环境中使用Lombok插件后,Java ...

  6. 【深度学习笔记】第 2 课:Logistic 多项式回归法

    """Softmax.""" scores = [3.0, 1.0, 0.2] import numpy as np def softmax ...

  7. 【神经网络与深度学习】学习笔记:AlexNet&Imagenet学习笔记

    学习笔记:AlexNet&Imagenet学习笔记 ImageNet(http://www.image-net.org)是李菲菲组的图像库,和WordNet 可以结合使用 (毕业于Caltec ...

  8. 【VS开发】 自己编写一个简单的ActiveX控件——详尽教程

    最近开始学ActiveX控件编程,上手不太容易,上网想找相关教程也没合适的,最后还是在师哥的指导下完成了第一个简单控件的开发,现在把开发过程贴出来与大家分享一下~ (环境说明--平台:vs2005:语 ...

  9. mysql 表字段 记录创建时间和更新时间

    sql语句创建: CREATE TABLE `NewTable` ( `id` int NOT NULL AUTO_INCREMENT , `name` varchar(20) NOT NULL , ...

  10. bi的tableau

    参考: 官网: https://help.tableau.com/current/server-linux/zh-cn/get_started_server.htm 可视化分析最佳做法: 实用指南 h ...