- 博客(14)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 antd mobile(九) iscroll5集成到项目中
刚开始做的时候没有采用iscroll，都做了快5个界面后才发现始终感觉界面差那么点意思，后来给用户演示时，发现界面跳转后回到当前界面又需要重新滚动到相应位置。用户说这个位置不能记住嘛？ 一开始感觉这个简单啊，不就是记住当前滚动位置，然后通过js将滚动条滚动到指定位置，做的时候发现坑了，手机端浏览器根本不支持简单的设置window.scrollTo(0,this.props.SinglePlanMd
2017-08-31 15:35:17
1206
原创 antd mobile(八) webpack通过别名取代路径引用
开发了好几个界面了，发现路径引用非常麻烦，而且非常的长。比如下面的代码：//自己封装的js组件import { GoingNav,GoingScroll } from './../../../components/goingMobile';//自己封装的工具类jsimport {DateFun} from '../../../utils/goingUtils';有一次温习webpack的时候，
2017-08-31 09:51:27
1601
原创 antd mobile(七) 固定NavBar
只能说antd mobile真的是为淘宝内部写的框架，竟然连固定NavBar显示的接口都没暴露出来。也就是NavBar不跟着屏幕滚动而滚动。说实话如果是用reactNative 开发当然不需要该接口，但问题是现在项目是做需要挂在微信端使用的，如果不固定NavBar基本是没法使用。第一步：其实固定NavBar非常简单，只要修改下css控制即可：.am-navbar{ display: -webk
2017-08-17 22:03:17
7224
原创 antd mobile（六）react-router 左进右出切换界面
第五节我们配置了页面路由切换，但发现个问题，所有界面都是向左切换的，感觉还是不对啊，仔细分析下原生app，会发现应该是进入是左切换，返回时应该是右切换出。第一步：修改路由动画配置信息： 修改前的代码： <ReactCSSTransitionGroup transitionName='left' component="div" transition
2017-08-16 23:41:52
3913
1
原创 antd mobile（五）react-router界面切换动画
用antd mobile时就在纳闷怎么没有提供界面切换动画，还为之苦恼了半天，后来才发现界面切换的动画是由react router提供了，赶紧的试试吧。第一步: 是安装ReactCSSTransitionGroup。 React为动画提供了一个附加组件ReactTransitionGroup，这个附加组件是动画的底层API，并且还提供了一个附件组件ReactCSSTransitionGroup，
2017-08-16 14:47:09
7557
3
原创 antd mobile(四) highcharts集成---采用react-highcharts
采用react-highcharts来集成highcharts，效果图： 第一步：安装react-highchartscnpm i --save-dev react-highcharts第二步：在文件头部引入相应的组件：var ReactHighcharts = require('react-highcharts');第三步：在需要添加图表的地方添加标签：<ReactHighcharts conf
2017-08-13 23:48:50
3893
原创 antd mobile (三) 集成highcharts--传统方式
highcharts是一套比较出名的图标组件，做了个集成展示，效果图： 第一步是安装highcharts组件cnpm i --save-dev highcharts第二步就是引入该组件：var Highcharts = require('highcharts');第三步：则就是在界面定义一个容器div，并为div设置相应的id <div className={styles.charDiv} id=
2017-08-13 23:38:28
1198
原创 antd mobile（二）高清方案配置
昨天把环境跑起来了，在chrome上正常，在safair上竟然就展示了50%。一猜就知道是mate的viewport设置问题。 又是几个小时的找资料配置才搞定，都是坑啊。 昨天搭建环境时字体过大，网上的方案是<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-s
2017-08-13 10:02:21
9092
原创 antd mobile(一) 环境搭建
以前需要一个组件，大概就3步，下载、引入、测试。 现在用个组件可能就是n步了，一个下午都没把antd mobile的组件展示出来，各种坑啊，看着官方文档一步一步也还是满地坑。 吐槽就免了，还是记录下来吧： 第一步：采用dva创建项目，这个如果不会看我前面写的文章。dva new goingMobile1创建完后，文件结构如下： 第二步：配置antd mobile的按需加载脚本和样式
2017-08-11 23:26:04
20238
6
原创 angular2（一）环境搭建
关于angular2的环境搭建的帖子到处都是，但跟着一步一步操作，没几个是可以跑的起来的。 如果是老油条则不需要看这种帖子，看这种帖子都是第一次搭建，如果有错误就让新手束手无策了，至少我都花了几个小时才跑出第一个例子：这里我们不采用webpack，下节我们再用webpack结合angular2来搭建一次。 创建配置文件 Angular 项目需要以下几个配置文件： package.json
2017-08-06 09:29:01
561
原创 ionic（一）初始化项目
使用ionic start ionic_demo02来初始化项目，执行了几次都失败告终。 实在不行只能分开执行了 第一步 只按照项目结构，而不去下载依赖 ionic start app --skip-npm解释一下上面的语句，–skip-npm表示跳过npm installl package阶段 所以这次就不会有那个错误提示，但也没有真的完成创建我们还需要进入app目录下，执行一次cnpm
2017-08-05 00:25:21
1150
原创 new Array()和[]的性能差别分析。
new Array()比[]的性能要差，但也没去验证过，今天突然心血来潮验证下，采用chrome浏览器试了试。<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><script type="text/javascript"> var star
2017-08-03 15:29:32
4877
1
原创 grunt的使用
使用grunt来压缩js代码，这可是前台开发必须的利器啊。 第一步 安装grunt-cli，该文件安装到全局的：cnpm install -g grunt-cli第二步安装grunt以及相关的插件cnpm install grunt --save-dev安装相关插件npm install --save-dev grunt-contrib-concat grunt-contrib-jshint gr
2017-08-03 14:13:05
354
原创 angularJs(一) 第一个例子todoList
angularJs都到4了，我还在看angular1.*没法子啊，必须把以前没学习的恶补上来。以前都是做hello world作为第一个例子，现在都是做todoList咯。 效果图： 1、点击提交将输入框的值放入到任务列表中 2、点击删除则就从任务列表中移出相应的元素代码如下：<!DOCTYPE html><html lang="en" ng-app="todoList"><head>
2017-08-01 13:31:36
401
bootstrap框架nifity
2016-05-01
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人