Vue.js写一个移动端新闻

dreamans 发布于2019-08-20 17:19 / 2471人阅读

摘要：异步编程问题本项目使用了极速数据的，后端的编写也要解决请求数据的异步问题，实现异步的方法有回调。回调层次多了，有回调地狱问题，代码的重用性可观性不好需要手动执行模块可解决，相比之下，和是比较理想的。届软件工程学生求份前端实习工作我的简历

Vue.js写的一个移动端新闻

刚学Vue，就自己动手撸了一个项目，项目可能不成熟，请大家多提意见

源代码

源代码地址: GitHub

预览 在线预览

在线预览地址: Vue新闻

ps: 电脑预览请切换到移动端,搜索的时候可能有点慢(API的问题)

预览图

技术栈

Vue2：采用最新Vue2的语法

Vuex：状态管理，实现不同组件之间的状态共享

vue-router：路由管理，实现路由的跳转

axios：发起http请求

Express：处理跨域请求问题

Webpack：自动化构建工具，大部分配置vue-cli脚手架已经弄好了，很方便

淘宝flexible：通过改变font-size,利用rem解决移动端适配问题

使用 Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

遇到的问题

布局问题：在做项目之前，应该构思好大致的布局结构，各个组件的结构设计与联系要想好，本人做这个项目就是布局出了问题，导致后面要修改一大堆的东西，这个项目也是重做了两次。

异步编程问题：本项目使用了极速数据的API，后端的API编写也要解决请求数据的异步问题，JS实现异步的方法有回调、Generator、Promise、Async。
回调层次多了，有回调地狱问题，代码的重用性、可观性不好；Generator需要手动执行（co模块可解决），相比之下，Promise和Async是比较理想的。

组件之间通信问题: 父组件可以通过props属性给子组件通信，子组件通过监听、触发事件向父组件通信，那兄弟组件呢？Vue2.0有eventBus解决这个问题，但是本人还是特别喜欢用vuex，vuex将状态集中管理，真是太方便了

总结

Vue.js真是太轻巧了，数据驱动使代码更加的简练，vue-router免去了传统前端跳转页面带来的页面的全部刷新，组件系统让我们可以用独立可复用的小组件来构建大型应用。

ps:18届软件工程学生求份前端实习工作我的简历

云服务器 GPU云服务器 php写一个后端管理写一个存储过程如何写一个爬虫移动端

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/83493.html

[使用 Weex 和 Vue 开发原生应用] 0 项目介绍和文章目录

摘要：全球首个使用和开发的原生应用那就是官方出了一个，是一个完整的使用的例子，并且用到了和服务端渲染。项目介绍和文章目录配置开发环境编写独立页面使用框架的特性使用平台的功能使用使用完整项目目录详解背景介绍 Weex 和 Vue 已经互相支持，这也不是新闻了（如果你觉得是新闻，自行在网上搜相关信息……），Vue.js 也因此具备了开发原生应用的能力。 Vue 官方仓库中包含了适配 Weex ...

DevWiki 2019-08-20 14:15 评论0 收藏0
vue.js+socket.io打造一个好玩的新闻社区

摘要：云新闻云新闻收藏的使用需要注意的地方提交的是，而不是直接的状态变更可以包含任意异步操作。的使用利用实现了简单的聊天功能，在同一个服务器下。 title: Socket.io+vue打造新闻社区date: 2017-06-12 20:19:05 tags: [vue.js,javascript,socket.io] vue2.0 + socket.io打造一个DIY新闻社区（web第一...

xiguadada 2019-08-20 17:19 评论0 收藏0