antd-mobile的例子--cnode

ANTD mobile源码分析 -- popover

最近的开发中要用到很多的各式各样的组件.但是发现ant design mobile(后面简称ANTDM)里很多的资源.于是就分析一下,学习学习. ANTDM直接使用了typescript,没有用ES2015,不过这不会是障碍,反而是学习typescript的一个好机会.基本上可以学的开源项目里比这个好的也不多. 目录结构 Popover组件在: | |--components | |--popover 我们要分析的组件全部都在components这个目录下. 在这个目录里还包含tests, de…

antd-mobile的例子--cnode

antd-mobile 简单的例子预览地址 https://shenggen1987.github.io/antd-mobile-roadhog/#/crm/pages/users github源码地址 https://github.com/shenggen1987/antd-mobile-roadhog…

【零售App】—— react/ant design mobile项目爬坑

一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动画和延迟时间可以实现. 期望:先选定动画效果,再调节动画时间和延迟时间,动画和延迟时间也能实现. 问题原因:原代码中的动画数据保存时机设置在选择动画类型的时候只能先选时间再选动画,如果先选动画再选时间,后选的时间就保存不了了解决方法:①将slider组件的onChange方法关掉,只保留onAf…

React+DvaJS 之 hook 路由权限控制

博客学院下载 GitChat TinyMind 论坛 APP 问答商城 VIP 活动招聘 ITeye 写博客发Chat 登录注册原 React+DvaJS 之 hook 路由权限控制 2016年12月09日 19:32:29 阅读数:19425 在model的subscriptions中进行匹配,分发到effects中进行判断和跳转,更多资料参考这里 effects 有三个参数: Effects put 用于触发 action . yield put({ type: 'todos/a…

roadhog 介绍

官方网站:https://www.npmjs.com/package/roadhog; 项目搭建demo: https://github.com/ght5935/antd-dva-less-webpack 一:roadhog roadhog 是一个 cli 工具,提供 server. build 和 test 三个命令,分别用于本地调试和构建,并且提供了特别易用的 mock 功能.命令行体验和 create-react-app 一致,配置略有不同,比如默认开启 css modules,然后还提供…

web前端学习路线（含20个真实web开发项目集合）

目前web前端工程师日均岗位缺口已经超过50000,随着互联网+的深入发展,html5作为前端展示技术,市场人才需求量将呈直线上涨. Web前端工程师的岗位职责是利用HTML.CSS.Java.DOM等各种web技能结合产品的界面开发,制作标准化纯手工代码,并增加交互功能,丰富互联网的Web开拓,致力于改进用户体验.现如今,Web前端工程师已经成为各大互联网公司不可或缺的热门职位,从业者队伍日渐庞大,这其中不乏零基础学习者和转行人士.为了方便大家系统而全面的掌握前端基础知识,小编特意整理了web…

create-react-app 搭建的项目中，使用 CSS Modules

create-react-app 搭建的项目中,使用 CSS Modules: 修改config目录下 webpack.config.dev.js 和 webpack.config.prod.js 文件: loader: require.resolve('css-loader'), options: { importLoaders: 1, // 新增下面2行 modules: true, localIdentName: '[name]__[local]__[hash:base64:5]' },…

mobx 知识点

antd+mobx 项目例子:https://github.com/cag2050/antd_mobx_demo 在 create-react-app 创建的项目中,使用 mobx:https://swizec.com/blog/mobx-with-create-react-app/swizec/7158 create-react-app 创建的项目中,支持 mobx 的装饰器:https://www.jianshu.com/p/d3f8cf7b3e31 mobx 与 vuex 的对比: mob…

移动APP开发框架盘点2：Web移动前端框架大全

前言自上次发布了<移动APP开发框架盘点>后,时间已经过去了三年, 为什么突然又写一篇续集呢?是因为有一个非常有意思的发现. 开源项目其实有一个成熟周期,这个周期大概是三年左右,自React框架在2013年发布并引爆了前端框架的大潮,这个属于前端的周期就此开始了. 之后在2015年5月开源的React Native又开启了属于Web移动前端的周期,15-16年,18-19年,21-22年正好就是属于移动前端的三个爆发点. 三年前,在第一个成熟收获期,我盘点了移动开发框架.在这第二个成熟收获期…

Go Mobile 例子 audio 源码分析

看这个源码分析前,建议先看更简单地例子 basic 的源码分析(http://www.cnblogs.com/ghj1976/p/5183199.html), 一些基础知识本篇将不再提及. audio 的源码比起 basic 最大的变化是使用了 golang.org/x/mobile/exp/sprite 这个对游戏精灵的封装包. 有关 audio 的简单说明请看:https://godoc.org/golang.org/x/mobile/example/audio 它是一个跑来跑去的 Gop…

Go Mobile 例子 basic 源码分析

OpenGL ES(OpenGL for Embedded Systems)是 OpenGL 三维图形API的子集,针对手机.PDA和游戏主机等嵌入式设备而设计.该API由Khronos集团定义推广,Khronos是一个图形软硬件行业协会,该协会主要关注图形和多媒体方面的开放标准. go 的 golang.org/x/mobile/gl 这个包是基于OpenGL ES 2了, 文档在: https://godoc.org/golang.org/x/mobile/gl Khronos的api文档…

自学JQuery Mobile的几个例子

JQuery Mobile是一个用于构建移动Web应用程序的框架,适用于主流的移动设备(智能手机.平板电脑),该框架利用了HTML5和CSS3技术减少了额外的脚本文件的编写.具体JQuery Mobile使用请转W3C页面:http://www.w3school.com.cn/jquerymobile/index.asp 例子:该例子创建了一个介绍海贼王故事的一系列页面 ex1.html文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra…

ROS Learning-030 （提高篇-008 A Mobile Base-06）控制移动平台 --- （Python）odom导航的例子：移动一个方块路径

ROS 提高篇之 A Mobile Base-06 - 控制移动平台 - (Python)再次使用odom导航的一个例子:移动一个方块路径我使用的虚拟机软件:VMware Workstation 11 使用的Ubuntu系统:Ubuntu 14.04.4 LTS ROS 版本:ROS Indigo 注意: 1 . ROS 提高篇这个专栏的教学有门槛. 2 . 如果你没有学习前面的教程,请想学习前面的 beginner_Tutorials 和 learning_tf 的ROS 相关教程. 一…

dva+antd写的一个react例子--服务器nginx 的配置

location ^~ /crm { rewrite ^/crm/(.*)(\.js|\.css|\.png|\.jpg|\.jpeg|\.gif|index\.php|robots\.txt)$ /$1$2 break; rewrite .* /index.html break; root /etc/nginx/static2/CIF_crm-frontend/dist/crm/; } 以上是nginx的配置 { "entry": "src/index.js",…

jquery mobile上传图片完整例子（包含ios图片横向问题处理和C#后台图片压缩）

上传图片本身是个基本的小功能,但是到了移动端就不那么简单了,相信找到这篇文章的你一定有深深的同感. 本文实例是:在(移动端)页面中点击图片,然后选择文件,然后保存.使用Asp.net 难点一:后台获取不到FileUpload的文件解决方案:在 form 中添加 enctype="multipart/form-data" data-ajax="false" 难点二:ios图片上传后显示为横向图片(ios横拍照片无此问题:Android无此问题) 解决方案:加载exi…

dva+antd写的一个react例子

github地址 https://github.com/shenggen1987/dva-cli-demo 效果图片…

antd pro table中的文件上传

概述示例代码列表页面 form 页面 model.js service.js 总结概述项目中经常会遇到在表格中展示图片的需求(比如展示用户信息时, 有一列是用户的头像). antd pro table 的功能很强大, 对于常规的信息展示只需参照示例配置 column 就可以了. 但是对于文件(比如图片) 在表格中的展示, 介绍并不多. 下面通过示例来演示 antd pro table 中图片的上传和展示. 示例代码前端主要包含如下 2 部分: 列表页面: 通过 antd pro tab…

Mobile Safari调用本地App, 否则进入App Store下载

需求: 如何让用户通过手机浏览器(Mobile Safari),访问一个URL就能直接打开ios上的App应用,如果该应用没有安装,那么直接跳转到App Store的App下载页面. 准备工作 ios SDK的OpenURL函数和URL Scheme JavaScript的window.location和setTimeout函数代码实现下面以打开暖岛app为例子,JS实现部分如下 window.location = 'nuandao://web2app'; setTimeout(functi…

使用 antd Table组件，异步获取数据

使用React.js + Redux + antd 制作CMS 后台内容管理系统,分享一点点积累,欢迎讨论. 在this.state中初始化数据: this.state = { pageNum:1, /*翻页查询*/ pageSize:10, /*分页查询*/ activePage: 1, /*默认显示一页*/ selectedRowKeys: [], // 这里配置默认勾选列 loading: false, /*antd*/ selectedRow:[] } 在制作过程中,根据需要把antd的…

开始学习Angular Mobile UI

介绍 Mobile AngularUI 可以让你使用Twitter Booostrap和Angular JS来开发混合移动App和桌面应用程序. 下面是是一些贯穿整个项目的步骤,我强烈的建议你去继续阅读,然后去阅读详情开始指导. 动过实例学习 Demo是一个学习Mobile Angular UI的一个很好的方式. 你可以从这里下载资源:https://github.com/mcasimir/mobile-angular-ui/tags. 打开下载好的文档浏览demo文件夹下面的文件如果你很熟…

jquery mobile 实现自定义confirm确认框效果

类似删除的效果,在执行之前,一般需要添加确认对话框,点确认的话执行,取消按钮就不执行,传统的js if(confirm('确定删除吗?')) { //执行代码 } 这种效果比较丑,使用jquery mobile优化一下需要引用的文件: <script src="~/Scripts/jquery-1.10.2.min.js"></script><link href="~/Scripts/Mobile/jquery.mobile-1.4.0.min…

jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> <head > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>验证加载顺序</title> <script src=…

用jQuery Mobile做HTML5移动应用的三个优缺点

JQuery Mobile 和 HTML5 的 3个优点 1. 上手迅速并支持快速迭代:在一个星期多一点的时间里,通过阅读JQuery Mobile文档以及O’Reilly出版的JQuery Mobile书籍,我完成了一个可以工作的app初步版本.在此之前我没有HTML5 / JQuery Mobile开发经验.与Android和iOS相比,使用JQuery Mobile和HTML5构建你的UI和逻辑会比在原生系统下构建快得多. 译注:原生系统:原装的操作系统,例如Android原生系统是Goo…

Ionic – 强大的 HTML5 Mobile App 开发框架

Ionic 是一个强大的 HTML5 应用程序开发框架,可以帮助您使用 Web 技术,比如 HTML.CSS 和 Javascript 构建接近原生体验的移动应用程序.Ionic 主要关注外观和体验,以及和你的应用程序的 UI 交互,特别适合用于基于 Hybird 模式的 HTML5 移动应用程序开发. 您可能感兴趣的相关文章 16款时髦的扁平化 HTML5 & CSS3 网站模板精选12款优秀 jQuery Ajax 分页插件和教程 10大流行的 Metro UI 风格 Bootstrap…

【初探移动前端开发05】jQuery Mobile (整合版)

前言为了方便大家看的方便,我这里将这几天的东西整合一下发出. 里面的例子请使用手机浏览器查看. 什么是jQuery Mobile? jquery mobile是jquery在移动设备上的版本,他是基于jquery.HTML5.CSS3构建的,他提供了一个丰富的交互性强的接口用以兼容不同移动平台. 于是我们去下载一番: 我这里就直接下载的这个压缩文件了,完了我们看看他有些什么东西,我们这个还是要依赖jquery的,所以还是准备一个吧. 这个东东是个好东西哦,他还有配套的样式呢,依赖他我们可以开发…

【初探移动前端开发05】jQuery Mobile (下)

前言继续我们移动端的学习,今天到了List相关了. 本文例子请使用手机查看 List列表在移动设备平台下,由于移动设备屏幕比较小,我们又是用手在上面点击的触屏方式,传统的列表模式在手机上就不太友好了. 虽然HTML5与CSS3提供了强大的界面实现方案,jquery mobile作为jquery框架的一个移动web插件,他根据移动屏幕大小优化了UI组件, 列表组件就是jquery mobile根据移动设备的特性而实现的组件库之一. 我们来一个个看看我们的列表吧普通链接列表 <!DOCTYPE…

【初探移动前端开发04】jQuery Mobile (中)

前言昨天我们一起学习了一部分jquery mobile的知识,今天我们继续. 这些是些很基础的东西,有朋友觉得这个没有其它的好,但是学习下不吃亏嘛,我反正也不会一起学习基础啦. 例子请使用手机查看哦内容区域格式布局网格布局 jquery mobile提供一种多列布局功能,由于移动设备的屏幕大小原因,一般情况还是不要使用多列布局啦. jquery mobile提供一种css样式规则来定义多列布局,对应css为ui-block,每列的样式是通过定义前缀+“-a”等方式对网格的列进行布局,a字母…

经典收藏 50个jQuery Mobile开发技巧集萃

http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 1.Backbone移动实例这是在Safari中运行的一款Backbone移动应用程序.想开始体验移动开发,一个好的出发点就是关注这个应用程序的构建方式.先不妨在你的浏览器中查看该应用程序. 相关链接:http://bennolan.com/2010/11/24/backbone-jquery-demo.html 2.使用媒体查询来锁定设备你可能会问如何使用…

【Jquery mobile】动态加载ListView 转

[Jquery mobile]动态加载ListView 分类: Jquery Mobile2011-12-01 09:04 13984人阅读评论(1) 收藏举报 jquerylistviewmobilestylesheetjavascriptlist 动态增加列表项是一个基本的功能,今天测试了一下.先贴下效果图: 点击“更多...”,就会增加列表项. 代码如下: <!DOCTYPE html> <html> <head> <title>Page Titl…

mormot THttpApiServer使用例子

mormot THttpApiServer使用例子 THttpApiServer封装了WINDOWS的HTTPS.SYS. unit Unit1; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes, Vcl.Graphics, Vcl.Controls, Vcl.Forms, Vcl.Dialogs , SynCommons, SynZip, SynCr…

【antd-mobile的例子--cnode】的更多相关文章