vue mand-mobile按2.0文档默认安装的是1.6.8版本 npm list mand-mobilebigbullmobile@1.0.0 E:\webcode\bigbullmobile`-- mand-mobile@1.6.8 按2.0文档弄个底部导航的一直出不来,原来是默认安装的是1.6.8版本的 https://github.com/mand-mobile/vue-cli3-example用vue-cli3重新创建个项目 注:后来发现上面这个只是简单的例子项目,npm inst…

在我们的看来,React是使用js创建大型快速网站应用的首要方法.它在Facebook和Instagram的使用已经为我们展现了它自己. React的一个很好的地方就在于当你创建应用的时候它使你思考如何创建.在这篇文档里,我们会带着你使用React创建一个查询产品数据表的流程. 以一个仿制品开始 想象我们已经有了一个JSON接口和一个设计师设计的仿制品.它的样子就像这样: 我们的JSON接口返回的数据就像这样: [ {category: "Sporting Goods", price:…

React是一个灵活的可以用于各种不同项目的框架,你可以用它来写新应用,你也可以逐步将它引进已有的代码库而不用重写整个项目. 试用React 如果你想玩一玩React,那么就去CodePen上试一试.尝试一下Hello World的React例子.不需要安装任何东西,只是修改代码然后查看结果. 如果你更喜欢在本地编辑,那么你也可以下载此文件,修改它,然后在本地用浏览器打开.但是它会做一个很慢的运行时代码转换,所以不要像这样在产品中使用. 创建一个单页应用 创建React应用这个项目是一个最好的方…

G.系列导航 [G]开源的分布式部署解决方案 - 导航 序言 因各种原因,决定先写使用文档.也证明下项目没有太监.至于安装过程复杂,是因为还没有做一键安装,这个现阶段确实没精力. 项目进度 (点击图片看大图) 必备工具 IDE:VS2015+ 运行环境: .Net Framework 4.6.1(已测可降4.5,其余没测) 宿主:IIS 下载源码 源码地址 http://git.oschina.net/doddgu/G/ ps:强烈希望顺手点下 star.watch.fork VS克隆源码 编译…

初次使用Android Studio,发现其智能提示不能像Visual Studio一样显示系统方法等的详细用途描述.经查找资料,问题原因是未安装SDK Document. 解决办法如下: 1.打开如下菜单(图一): (图一) 2.在下图二中选中Documentation for android SDK,确定后即可自动下载文档 3.下载后,可能此时仍无法弹出方法详述,这时要打开 jdk.table.xml,文件路径 /$USER_HOME$\.AndroidStudio2.3\config\op…

高阶组件(HOC)是React里的高级技术为了应对重用组件的逻辑.HOCs本质上不是React API的一部分.它是从React的组合性质中显露出来的模式. 具体来说,一个高阶组件就是一个获取一个组件并返回一个组件的函数. const EnhancedComponent = higherOrderComponent(WrappedComponent); 然而一个组件将props转变为UI,一个高阶组件将一个组件转变为另外一个组件. HOCs在第三方React库里也是有的,就像Redux里的con…

文档页面地址:https://doc.react-china.org/docs/thinking-in-react.html 该文档只给了具体实现思路,下面是我实现的代码. 初学react,如果有写的不规范的地方,望大家多多指正! FilterableProductTable (橙色): 包含了整个例子 SearchBar (蓝色): 接受所有的用户输入 ProductTable (绿色): 根据用户输入过滤并展示数据集合 ProductCategoryRow (绿松石色): 展示每个分类的标题…

Vim8.0是近十年来的一次大更新,支持任务.异步I/O.Channels和JSON以及异步计时器.Lambdas 和 Closures等,还包括对GTK + 3的支持.由于ubuntu默认安装的Vim版本一般都是7.4.52,该版本不满足许多vim插件的需求(如YouCompleteMe),因此需要升级Vim到新版本. 1. 源码编译安装vim8 Ubuntu下源码编译安装Vim8的方法如下: 1234 git clone https://github.com/vim/vim.gicd vim…

部署VMware vSphere 5.5 实施文档 ############################################################################### ## ver1.0 2014-09-09 ## ## 本文内容来自中国专利信息中心-基础系统处—张阳 ## ## 如有转载,请务必保留本文链接及版权信息. ## ## QQ:962903  ## ##############################################…

部署VMware vSphere 5.5 实施文档 ############################################################################### ## ver1.0 2014-09-09 ## ## 本文内容来自中国专利信息中心-基础系统处—张阳 ## ## 如有转载,请务必保留本文链接及版权信息. ## ## QQ:962903  ## ##############################################…

部署VMware vSphere 5.5 实施文档 ############################################################################### ## ver1.0 2014-09-09 ## ## 本文内容来自中国专利信息中心-基础系统处—张阳 ## ## 如有转载,请务必保留本文链接及版权信息. ## ## QQ:962903 ## ## E-mail:zhangyang_6@sipo.gov.cn## ###########…

Zeal是一个为软件开发者提供的离线文档浏览器. 一.下载安装 下载地址:https://zealdocs.org/ 二.安装后下载自己需要的文档 1.通过Zeal原生源直接下载文档 Tools -> docsets... 弹出文档集管理窗口,选择Available  在已有文档集中选择需要的文档,单击Download进行下载,下载完成即可使用 2.通过Installed页面的Add feed按钮添加第三方源的方式新增文档 第三方源文档下载地址:https://zealusercontribut…

Refs 提供了一种方式,用于访问在 render 方法中创建的 DOM 节点或 React 元素. 在标准的React数据流中,props是使得父组件和子组件之间交互的唯一方式.你通过props重新渲染子组件.然而,有些情况需要你必须在数据流之外修改一个子组件.这个子组件可以是一个React组件的实例,或者是一个DOM元素.对于这两种情况,React提供了解决方式. 什么时候使用refs 以下有几种合适的情况使用refs: 处理焦点,文本选择或者媒体播放 触发强制的动画 整合第三方DOM库 避…

开始学习React最简单的实践就是去试一试CodePen上面的Hello World程序.你不需要安装任何东西,只要新开一个标签页打开例子依照原例操作即可.如果你更喜欢在本地开发,那么来看看安装的介绍. 最简单的React例子就像这样: ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('root') ); 这段代码渲染了一个页面的头部,显示文字“Hello World”. 接下来的章节会逐步介绍如何使…

注:采用ES6+JSX语法 1.开始一个项目 在React中使用Onsen UI 需要首先安装onsenui和react-onsenui模块. 可以使用monaca CLI工具包快速初始化一个应用: $ npm install -g monaca # Install Monaca CLI - Onsen UI toolkit $ monaca create helloworld # Choose React template $ cd helloworld; monaca preview # R…

React和web components是为了解决不同问题而创立的.web components为可重用组件提供了健壮的封装,而React提供了声明式的库来保持DOM和数据同步.这两点是互相补充的.作为一个开发者,你可以自由地在你的web components里使用React,或者在React里使用web components,或者两者同时使用. 很多人使用React而不使用web components,但是你也许想要试一试,特别是如果你在使用依靠web components开发的第三方UI组件…

React中,通过React组件可以很容易地追踪数据流.当你关注一个组件,你可以发现哪一个props被传递了,这样使得你的应用很容被推断. 在一些情况下,你想要传递数据通过组件树而不需要去手动在每一层传递.你可以直接使用强大的context API. 为什么不使用context 大量的应用不需要使用context. 如果你希望你的应用稳定,不要使用context.这是一个实验性的API在未来的版本中有可能会崩溃. 如果你不熟悉state管理库就类似于Redux或者Mobx,不要使用context…

React提供了一个声明式地API因此你不用担心每一次更新什么东西改变了.这使得开发应用变得简单,但是这个东西在React中如何实现的并不是很明显.这篇文章会解释我们在React的算法中所做的选择以便组件的更新是可预测的当为了高性能的app而变得速度足够快. 目的 当你使用React,在一个单独的时间点你可以考虑render()函数会创建一棵React元素的树.当下一次state或者props更新了,render()函数将会返回一个不同的树.React随后需要解决怎样有效率地更新UI去匹配最新的…

JSX并不是使用React的一个强制需求.当你不需要在你的构造环境里设置编译那么不使用JSX会很方便. 每一个JSX元素只是调用React.createElement(componnet, props, ...children)的语法糖.因此,JSX能做的事原生js同样也做得到. 举个例子,下面的代码用JSX: class Hello extends React.Component { render() { return <div>Hello {this.props.toWhat}</d…

通常你会将一个React组件定义成一个普通的js类: class Greeting extends React.Component { render() { return <h1>Hello, {this.props.name}</h1>; } } 如果你不打算使用ES6,你也可以使用create-react-class 模块: var createReactClass = require('create-react-class'); var Greeting = createRe…

在内部,React使用好几种聪明的技巧去最小化更新UI所需要的DOM操作.对于很多应用来说,使用React会使得构建用户界面非常之快而且不需要做太多专门的性能优化.虽然如此,还是有一些方法可以让你为React应用加速. 使用生产构建 如果你正在性能测试或者在你的应用里遇到性能测试问题,确保你测试时使用了压缩了的生产构建: 对于创建React应用,你需要运行npm run build然后遵循指令 对于单文件构建,我们提供生产环境.min.js的文件版本 对于模块管理,你需要设置NPDE_ENV=p…

大多数情况下,我们建议使用受控组件(也就是用React的state来控制表单元素的value值)来实现表单.在一个受控组件里,表单数据被React组件处理.另一种方案就是非控制组件,这样的话表单数据就被DOM本身所处理. 要写一个非控制组件,来替代写一个事件处理函数来处理每一次state的更新,你可以使用ref引用来从DOM里获取表单的value值. 举个例子,这段代码在一个非受控组件里接受单个属性: class NameForm extends React.Component { constr…

注意: React.PropTypes 自 React v15.5 起已弃用.请使用 prop-types 库代替. 随着你的应用的开发,你会使用类型检查的方法来捕获很多bug.对于一些应用,你可以使用js扩展就像Flow或者TypeScript去对整个应用进行类型检查.但是即使你不是用这些扩展语言,React也有一些内置的类型检查功能.在props上运行类型检查,你可以指派特殊的propTypes属性: import PropTypes from 'prop-types'; class Gre…

根本上,JSX只是为React.createElement(component, props, ...children)函数提供语法糖.JSX代码是这样的: <MyButton color="blue" shadowSize={2}> Click Me </MyButton> 编译成这样: React.createElement( MyButton, {color: 'blue', shadowSize: 2}, 'Click Me' ) 你也可以使用自己闭合的…

React拥有很强大的组合模型,我们建议使用组合来替代继承来重利用组件之间的代码. 在本章节中,我们将讨论一些开发者经常触及继承的问题,并且我们该如何使用组合来解决这些问题. 组合 一些组件事先不知道它们的子组件.这种问题特别对于组件类似Sidebar或者Dialog这种通用的“盒子”. 我们建议像这样的组件使用特殊的children属性去直接传递子元素到它们的输出里: function FancyBorder(props) { return ( <div className={'FancyBo…

经常有些组件需要映射同一个改变的数据.我们建议将共用的state提升至最近的同一个祖先元素.我们来看看这是怎样运作的. 在这一节中,我们会创建一个温度计算器来计算提供的水温是否足够沸腾. 我们先创建一个叫BoilingVerdict的组件.它接受摄氏度温度为prop,并且打印水温是否足够沸腾: function BoilingVerdict(props) { if (props.celsius >= 100) { return <p>The water would boil.</p…

HTML表单元素和 React里的其他DOM元素有些不同,因为它们会保留一些内部的状态.举个例子,这个普通的表单接受唯一的name值: <form> <label> Name: <input type="text" name="name" /> </label> <input type="submit" value="Submit" /> </form>…

首先,我们回顾一下在js里如何转换数组. 给出下面的代码,我们使用map()函数来获取一个数组的numbers然后将值变成两倍大.我们分配新数组由map()返回: const numbers = [1, 2, 3, 4, 5]; const doubled = numbers.map((number) => number * 2); console.log(doubled); 这段代码在控制台输出[2, 4, 6, 8 ,10]. 在React里,把数组转变成一系列元素也是一样的. 渲染多个组件…

在React中,你可以创建不同的组件各自封装你需要的东西.之后你可以只渲染其中的一部分,这取决于应用的state(状态). 条件渲染在React里就和js里的条件语句一样.使用js里的if或者条件表达式创建元素来显示当前的状态,然后让React来更新UI. 看看下面两个组件: function UserGreeting(props) { return <h1>Welcome back!</h1>; } function GuestGreeting(props) { return &…

React元素处理事件和DOM元素处理事件很类似.下面是一些语法的不同之处: React事件的命名是用驼峰命名,而不是小写字母. 利用JSX你传递一个函数作为事件处理器,而不是一个字符串. 举个例子,这是一段HTML: <button onclick="activateLasers()"> Activate Lasers </button> 而在React中略微有些不同: <button onClick={activateLasers}> Activ…