上一篇博文,我们已经顺利的从cnodejs.org请求到了数据,但是大家可以注意到我们的/src/api/index.js的第一句就是: // 配置API接口地址 var root = 'https://cnodejs.org/api/v1' 这里我们的接口地址是写死的,这固然是一个问题,但是其实并不是最重要的,而是在cnodejs.org已经帮我们把接口处理的很好了,帮我们解决了跨域问题.而在实际开发中,很多项目接口是不允许我们跨域请求的. 而在第一章说到的前后端分离开发模式,前端开发前端,同…
上一篇博文中,我们将接口的地址通过webpack代理到了本地,解决了跨域的问题.在之前的文章中,我们一直对项目进行配置,并没有真正的切入正题,可能很多人还不明白我们要做什么?那么今天,我们就要开写代码了.忠心感谢FungLeo,是你们无私的奉献,才让我们有了学习的参考,以下是地址:本文转载:http://blog.csdn.net/fungleo/article/details/77575077 什么是*.vue文件首先,我们用 vue-cli 脚手架搭建的项目,里面我们已经遇到了很多,如 in…
通过上一篇博文的学习,我们其实已经完成了我们设想的项目的开发.但是,我们做好的这套东西,是基于 nodejs 开发的.而我们最终希望,我们开发的项目,生成好一堆文件,然后随便通过任何一个 http 服务就能跑起来,也就是,还原成我们熟悉的 html+css+js 的模式.这章,我们来讲解这部分内容. 打包项目进入到我们的项目根目录 d: cd vueworks/my-vue 然后运行如下代码,进行打包: npm run build 结果如下: 现在我们已经把项目打包好,打完好的项目默认位置在/d…
上一章,我们认识了项目的目录结构,以及对项目的目录结构做了一些调整,已经能把项目重新跑起来了.今天我们来搭建api接口调用工具Axios.Vue本身是不支持ajax调用的,如果你需要这些功能就需要安装对应的工具. 支持ajax请求的工具很多,像superagent和axios.今天我们用的就是axios,因为听说最近网上大部分的教程书籍都使用的是axios,本身axios这个工具就已经做了很好的优化和封装,但是在使用时,还是比较繁琐,所以我们来重新封装一下. 安装Axios工具 cnpm ins…
在上一篇博文中,我们对vue组件有了一个简单的认识和大概的理解.在之前认识项目结构的时候,我们在/src目录中创建了一个components的文件夹,而今天就要用到了,这个文件夹的作用就是放置我们的自定义组件. 制作header.vue组件在components文件夹中,创建一个header.vue的文件,然后填入以下内容: <template> <header class="header"> <h1 class="logo">V…
概述在最开始听说vuejs这个词是在2016年,当时天真的认为自己是个后端开发工程师不需要学习太多的前端知识,不过紧接着在2017年在公司就用到了vuejs.对于初学者(尤其是干后端的初学者)来说,刚接触时,有好多思路都很难理解. 本来写这一系列博客,只是为了记录自己在这一段时间学习vuejs的成果.如果有何纰漏请大家多多理解,不喜勿喷… 再说,在目前互联网的调整发展情况下,javascript更是在快速的更新迭代,如今对前端工程师来说,需要会的不只有css+div,js+jq了.近年来,jav…
上一篇博文,我们搭建了一套基础的vuejs的环境,首先安装node.js,然后利用npm包管理器,安装vue-cli,设置淘宝镜像,初始化项目,安装依赖,运行.在这一篇,我们将认识vuejs项目里的各个目录结构. 基础项目目录 build // 编译配置文件,一般不用管 |-build.js |-check-versions.js |-logo.png |-utils.js |-vue-loader.conf.js |-webpack.base.conf.js |-webpack.dev.con…
我们在上一篇博文中,渲染出来了一个列表,并在列表中使用了router-link标签,标签内的:to就是链接地址,昨天咱们是<router-link :to="'/content/' + i.id">这样写的,今天我们来完成内容页面的渲染. 编写内容页面还是废话少说,先上代码,将以下代码保存到/src/pages/Content.vue中: <template> <div> <myHeader></myHeader> <h…
上一篇博文我们整合了Amaze ui,并且调整了一个头部header和底部footer文件,其实做起来也很简单,只要按照步骤来做,完全没有问题.今天我们来重新调整一下列表页面和内容页面,使我们做的后台管理系统更有范儿. 制作左侧菜单一个后台管理系统,大致的样式都是分为南北东西的,而西(也就是左侧)一般是我们的菜单.如图: 我们今天就来把我们的项目完成到如上图的样式,首先我们来制作左侧的菜单,在/src/components/下新建menu.vue.代码如下: <template> <di…
在上一篇文章中,大致介绍了一下本系列博文以及学习vuejs我们需要了解的一些概念,希望大家认真阅读,所谓知己知彼,百战百胜,学习也一样,工欲善其事,必先利其器,要想学好vuejs,那前提的概念一定要熟悉.否则在接下来的博文中,遇到一些概念很有可能理解不了. 由于不能FQ,所以之下大部分的操作都是在国内的网站里进行下载或是用的国内代理. 安装NodeJs下载Node.js,在这里我用的是Node中文网http://nodejs.cn/下载.大家可以按自己电脑的系统来下载不同版本的Node.关于Li…
上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主题的 Web 组件,可快速构建界面出色.体验优秀的跨屏页面,大幅提升开发效率.最主要是妹子UI的性能好,轻量级. 获取妹子UI(Amaze UI)下载地址:http://amazeui.org/getting-started 点击上方绿色的按钮,我们来下载最新版的妹子UI,下面有配套的文档和编辑器,…
很多人学习 js 都是从 jQuery 开始的,我也不例外.有时候进行一些操作的时候,还是感觉 jQuery 比较好用,那么,我们如何在项目中使用 jQuery 呢?这篇博文带你实践. 引用 jQuery 文件首先呢,jQuery 是提供了 npm 的安装包的.我们的 vue-cli 脚手架,也是支持引入的.不过设置比较麻烦,如果你对使用这种方法比较敢兴趣,可以直接参考下面的内容:https://maketips.net/tip/223/how-to-include-jquery-into-vu…
前言:最近,新的平台还没有开发完成,原来的老项目又提出了新的需求:系统国际化.如果是前后端完全分离的开发模式,要做国际化,真的太简单了,有现成的解决方案,基于Node构建的时下热门的任何一种技术选型都有成熟的方案,比如: vue + vue-i18n angular + angular-translate react + react-intl 但现在的情况是老的项目并没有使用这类架构.说起国际化,博主几年前就做过,在MVC里面实现国际化有通用的解决方案,主要就是通过资源文件的方式定义多语言.最初…
前言:最近,新的平台还没有开发完成,原来的老项目又提出了新的需求:系统国际化.如果是前后端完全分离的开发模式,要做国际化,真的太简单了,有现成的解决方案,基于Node构建的时下热门的任何一种技术选型都有成熟的方案,比如: vue + vue-i18n angular + angular-translate react + react-intl 但现在的情况是老的项目并没有使用这类架构.说起国际化,博主几年前就做过,在MVC里面实现国际化有通用的解决方案,主要就是通过资源文件的方式定义多语言.最初…
但现在的情况是老的项目并没有使用这类架构.说起国际化,博主几年前就做过,在MVC里面实现国际化有通用的解决方案,主要就是通过资源文件的方式定义多语言.最初接到这个任务,并没有太多顾虑,毕竟这种东西有很成熟的解决方案,实现起来难点不会很大.可当真正动起来手来去实现的时候发现一些问题,这里先介绍下我们老平台的架构:MVC+WebApi,MVC项目负责页面渲染,webapi负责数据接口,是一种很传统的架构方式.国际化主要在MVC端去做就好了,可是由于MVC项目里面使用了大量第三方bootstrap组件…
近期的游戏开发大体上接近尾声,总结了不少关于Unity3d面向Windows几大平台开发时遇到的各种坑以及怎样填坑的经验.总的来说,Windows8.1 Windows8/RT以及WindowsPhone这几个平台的开发人员很的少,文档也很的有限.甚至于MSDN的文档写的也是不清不楚.所以我认为有必要用一系列的文章具体的和大家分享一下. 这一篇仅仅是一个文件夹,先介绍一下我要写的一些部分: 1. Unity项目导出至各个平台注意事项. 2. API不兼容问题以及怎样解决. 3. Windows8…
业务情景 两台服务器,一台阿里云ECS云服务器(专用网络),另一台是阿里云数据库MongoDB,处于安全考虑MongoDB是不运行外网连接的,那接下来就看怎么实现公网访问. 看到上面红色的网络类型描述,有些人可能已经看出问题所在了,小小的提示:问题出现在开放端口上! 专用网络和经典网络的大致区别可以用一句话讲明白:专用网络更安全,需要设置和配置的东西比较多,适合精通网络的高手:经典网络使用更方便,适合更适合小白用户,使用起来更简单方便,不用繁杂的配置: 思路分析 既然无法直接使用公网(俗称的外网…
----微信支付文档,不得不说,挺乱!(吐槽截止) 功能背景 微信公众号中,点击菜单或者扫码,打开公众号中的H5页面,进行支付. 一.技术栈 前端:Vue:3.0.0,typescript:3.9.3,axios,vant,weixin-jsapi(微信官方wxjsdk) 后端:Koa,wxpay-3(不错的apiv3封装 https://github.com/yangfuhe/node-wxpay),axios 二.微信公众平台配置 1. 申请公众号. 2. 公众号设置:功能设置,JS接口安全…
1   数据表 1.1.数据表是存放数据字段信息的地方:在Oracle,数据表拥有者单位是用户,同时数据表属于表空间.如: 登录my_user用户在orcl表空间下创建的表就是 my_user用户在ocrl表空间下的数据表(有点绕,多用用就了解了) 2   创建数据表 2.1.创建数据表 create table RYXXB( -- 创建表名 RYID ) primary key, -- primary key 设置主键 RYXX ) not null, -- not null 不可为空 RYB…
Maybe 这个问题很简单,因为解决方法是非常简单,但填坑过程会把人逼疯,在阿里云ONS工作人员.同事和朋友的协助下,经过一天的调试和瞎捣鼓,终于解决了这个坑,把问题记下来,也许更多人在碰到类似问题的时候,会开放思路.当然不得不说,Ons的.NET接口还很不完善,甚至没有独立在Windos 2008/2012服务器测试过,希望官方加把力. 1.阿里云ONS介绍 ONS(Open Notification Service)即开放消息服务,是基于阿里开源消息中间件MetaQ(RocketMQ)打造的…
JDK提供了两个方法,System.currentTimeMillis()和System.nanoTime(),这两个方法都可以用来获取表征当前时间的数值.但是如果不仔细辨别这两个方法的差别和联系,在使用当中也很容易出错.笔者在前不久的工作当中使用System.currentTimeMillis()时就踩了一个大坑,后来在查明System.currentTimeMillis()和System.nanoTime()的特性后,才用System.nanoTime()来填了这个坑.本文,笔者就以自己的踩…
Jinkey原创感谢 showonne.yubang 技术指导Demo 地址:http://demo.jinkey.io/vue2源码:https://github.com/Jinkeycode/vue2-example 什么是 Vue Vue 是一个前端框架,特点是数据绑定 比如你改变一个输入框 Input 标签的值,会自动同步更新到页面上其他绑定该输入框的组件的值 数据绑定 组件化 页面上小到一个按钮都可以是一个单独的文件.vue,这些小组件直接可以像乐高积木一样通过互相引用而组装起来 组…
目录 Mybatis-Plus 我来填坑~ 目录 一.简单介绍 官方说明 : 成绩: 最新版本: 开发层面MyBatis-Plus特色 Mybatis-Plus中的Plus 二.MP的特性 三.MP框架结构 四.简单的入门Demo(Mysql) 五.核心功能 核心一-简便之-代码生成器(AutoGenerator) 核心二 - 清晰之-CRUD接口 核心三 - 强大之 -Wrapper条件构造器 六.插件及扩展 Demo代码地址: 工程: 七 .总结 参考文档: Mybatis-Plus 我来填…
  让App聊起来 IM开发从入门到填坑Demo IM的实现方式 拿来主义,使用第三方IM服务 IM的第三方服务商国内有很多,底层协议基本上都是基于TCP的,类似有网易云信.环信.融云.极光IM.LeanCloud.云通讯IM(腾讯).云旺IM(阿里).容联云.小能.美洽等等,技术也相对比较成熟,提供后台管理和定制化的UI,拿来主义,半小时集成. 缺点也很明显:定制化程度太高,需要二次开发,很多东西我们不可控,关键是太贵了.如果IM对于APP只是一个辅助功能,如客服系统.消息推送等,也基本够用.…
一.背景 最近公司给第三方开发了一个公众号,其中最重要的功能是支付,由于是第一次开发,遇到的坑特别的多,截止我写博客时,支付已经完成,在这里我把遇到的坑记录一下(不涉及退款).不得不吐槽一下,腾讯这么大的公司,写的代码真的烂,变量命名不规范(后来又开发了公众号分享,发现对于同一个变量,两个地方的变量名不同),文档写的垃圾,而且好多时候,有返回的错误码但是文档上没说明,另外线上线下测试极其不方便. 二.参考资料 1.JSAPI支付开发文档:主要是支付开发过程中接口.流程.注意事项.常见问题等: 2…
一.序言 应公司要求要求,要用小程序开发一个信息录入系统.没办法只能听话来填坑. 先介绍一下环境:客户端——小程序:服务端——java:数据库——mysql:服务器——centos7 需求:客户端输入信息,insert到数据库,没错就是这么一个简单的小功能,却为这个请求折腾了大半天 二.开始 先来看一下wx.request的官方文档:地址如下https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html#wxrequestob…
接触微信支付之前听说过这是一个坑,,,心里已经有了准备...我以为我没准跳坑出不来了,没有想到我填上了,调用成功之后我感觉公司所有的同事都是漂亮的,隔着北京的大雾霾我仿佛看见了太阳~~~好了,装逼结束...进入正题 开发准备: 1.在微信开放平台申请账号 2.成功后创建应用,就是填一些看似很官方很正经的资料了...(说审核7天左右,没有意外的情况下你的app第二天就审核成功了是不是很开心,有了appid,是不是就可以调用微   信支付了????-------想多了,真的) 3.微信支付是需要额外…
终于开始新一篇的填坑之旅了.RN厉害的一个地方就是RN可以和Native组件通信.这个Native组件包括native的库和自定义视图,我们今天主要设计的内容是native库方面的只是.自定义视图的使用会在后面讲到. 坑是什么样的坑 主要的是遇到一个业务需求,需要检测当前应用的版本是什么.需要返回当前的版本号和build数. 主要的需求在native来说非常简单: NSString * version = [[NSBundle mainBundle] objectForInfoDictionar…
代码在这里: https://github.com/future-challenger/petshop/tree/master/client/petshop/src/controller 回头看看RN的填坑之旅系列,发现一路写下来都是我在开发中遇到的问题如何解决的.兴之所至,不问顺序.于是出现一个问题,填坑系列和学习知识的顺序不是很一致.比如今天要说的布局问题.其实在一个app开发之前,就应该有所了解.否则的话每次看到的<View style={{flex: 1}} />代表的是什么呢?上来就…
出于: androidChina   http://www.androidchina.net/3595.html 学习 Android 至今,大大小小的坑没少踩,庆幸的是,在强大的搜索引擎与无私奉献的人们的帮助下,我遇到的坑都顺利地被填平了. 为了便于日后遇到同样的问题时,能免于再次搜索带来的麻烦,我养成了收藏书签的习惯,随着书签(Tips)的日积月累,我想,是时候该有这个项目了. 如果你是个 Android 新人,那么我希望这份列表,可以成为你踩到坑时的不完全手册. 当然,这份列表一定会有遗漏…