20190218 前端开发日报

如何使用 vue + typescript 编写页面 ( vuex装饰器部分 );京东 PLUS 会员项目前端性能优化实践;javascript replace高级用法;刷前端面经笔记(十一);Nuxt.js 数据双向绑定;阅读源码后,来讲讲 React Hooks 是怎么实现的;使用Infinite Ajax Scroll实现下拉加载效果;HTML5迷你音频播放器

  1. 如何使用 vue + typescript 编写页面 ( vuex装饰器部分 ) 一般来说,数据分为两种方式 自有数据,即组件本身持有数据,表现即 data部分 外部数据,可由prop标签属性,inject父级注入,vuex提供。 组件本身自身持有数据内容,并不需要外部的参与的情况下,不需要外部数据。但是在一般来说,使用外部数据比较常见。 prop与父级紧密相关 使用inject注入时,无法…
  2. 京东 PLUS 会员项目前端性能优化实践 京东PLUS会员项目是国内第一个电商付费会员项目,正式开通的会员数量已破千万。我团队从2016年接手这个项目的前端开发工作,一路见证了它的高速成长,也为此贡献了自己的力量。 这个项目有几个特点: 第一,需求多。移动端使用 H5 开发,曾有人问为什么不用原生或者 RN 开发? 我觉得吧,以这个项目的…
  3. javascript replace高级用法在前端与后台交互的时候我们通常都需要将后台传递的数据绑定到html中,这个绑定数据的方式我们通常是使用jQuery或者使用原生的innerHTML进行绑定,当然也可以使用artTemplate模板来绑定数据,那么artTemplate模板…
  4. 刷前端面经笔记(十一)输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否可能为该栈的弹出顺序。假设压入栈的所有数字均不相等。例如序列1,2,3,4,5是某栈的压入顺序,序列5,4,3,2,1或3,2,1是该压栈序列对应的一个弹…
  5. Nuxt.js 数据双向绑定假定我们有一个需求,一开始通过mounted()将一个字符串渲染在页面上,但是我们经过操作后修改了数据并且需要将得到的结果重新异步渲染到页面中去,而不是跳转刷新页面来重新渲染
  6. 阅读源码后,来讲讲 React Hooks 是怎么实现的 React 16.7-alpha中新增了新功能:`Hooks`。总结他的功能就是:让`FunctionalComponent`具有`ClassComponent`的功能。 “`js import React, { useState, useEffect } from ‘react’ function FunComp(props) { const = useState(‘initialState’) function handleChange(e) { setData(e.targe…
  7. 使用Infinite Ajax Scroll实现下拉加载效果 现在很多网页都有个体验不错的效果:浏览到页面底部的时候,自动加载下一页内容,也就是下拉加载效果,这种效果可以让用户不用点击“下一页”按钮,也可以实现翻页,无论在PC还是手机上,体验效果都很不错,下面我就介绍一下网站开发的时候如何实现下拉加载效果。 首先去 infiniteajaxscroll网站 下载一个名为jquery-ia…
  8. HTML5迷你音频播放器 这是一款HTML5迷你音频播放器插件。该音频播放器插件小巧、干净,可以自定义操作按钮,可以为页面提供最小的音乐播放器功能。 查看演示 下载源码 引入文件 在页面中引入main.min.css和app.js文件。 <link rel="stylesheet" href="main.min.css"> <script src…
  9. vue-cli3 项目优化之通过 node 自动生成组件模板 generate View、Component 做前端的大家都知道通过 vue 开发的项目每次创建新组建的时候,都要新建一个目录,然后新增 .vue 文件,在这个文件中再写入 template 、 script 、 style 这些内容,虽然在写入的时候大家都有自己的自动补全共计,不过这些都是模板性的,每次都要这样重复操作,很麻烦有没有。 本文就是通过 node 来帮助我…
  10. 从零开始React服务器渲染(SSR)同构(基于Koa) 自前端框架( React , Vue , Angelar )出现以来,每个框架携带不同理念,分为三大阵营,以前使用 JQuery 的时代已经成为过去,以前每个页面就是一个 HTML ,引入相对应的 JS 、 CSS ,同时在 HTML 中书写 DOM 。正因为是这样,每次用户访问进来,由于 HTML 中有 DOM 的存在,给用户的感觉响应其实并不是很慢。 但是…
  11. 自底向上的web数据操作指南JavaScript一直以来给人一种比较低能的感觉,例如无法读取系统上的文件,不能做一些底层的操作.
  12. 你可能不清楚的 Vue Router 深度用法(一)Vue Router 简单易上手,能实现大部分的需求。但是,如果在项目里需要更细致的控制路由,以实现与其同步的效果,就需要挖掘其文档里没详细提及的内容。第一章为路由元信息用途挖掘。

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流