09 2017 档案
摘要：vue2.0 禁止 子组件修改父组件数据 在Vue2中组件的props的数据流动改为了只能单向流动，即只能由组件外（调用组件方）通过组件的DOM属性attribute传递props给组件内，组件内只能被动接收组件外传递过来的数据，并且在组件内，不能修改由外层传来的props数据。 在Vue2.0中，
阅读全文
摘要：1.概述： 简单来说，假如父组件需要在子组件内放一些DOM，那么这些DOM是显示、不显示、在哪个地方显示、如何显示，就是slot分发负责的活。 2.默认情况下 父组件在子组件内套的内容，是不显示的。 代码： 效果图： 显示内容是一个button按钮，不包含span标签里面的内容； 3.单个slot
阅读全文
摘要：1.场景： Object： Array： 2.场景 解决方案： 使用 v-for 外层 div 就变成 根元素，因为 一个 template 的根元素不能为多个，需要在外层嵌套一层 div 组件中引用：
阅读全文
摘要：情景：axios 异步加载数据，当返回数据为一个 数组 时，双花括号中 这样写 会报错 {{informationDetail[0].img}} 解决方案一：通过 v-if 进行判断 解决方案二：单独 定义 对象 存储 数据
阅读全文
摘要：1.index.html 子组件直接修改父组件的数据 组件通讯： vm.$emit(); vm.$on(); 父组件和子组件： 子组件想要拿到父组件数据： 通过 props 之前,子组件可以更改父组件信息,可以是同步 sync 现在,不允许直接给父级的数据,做赋值操作 点击按钮之前 点击按钮之后 原
阅读全文
摘要：1.全局过滤器 （1）normalTime.js 自定义 将 时间戳 转换成 日期格式 过滤器 （2）index.js 入口文件 2.全局引入 main.js 3.在组件中使用 Article.vue 4.动画效果 （transition 实现动画效果） App.vue 5.效果图
阅读全文
摘要：1.结构 2.配置详情页路由 router.config.js 3.通过 router-link路由 跳转详情页 Home.vue 4.通过 正则 获取 path 中的 id, 并 通过 id 获取该详情页信息 Article.vue 5.效果图
阅读全文
摘要：1.组件结构 index.js Loading.vue 2.全局引用 loading 组件 main.js 3.引用 App.vue 4.效果图 当 loading 为 true 时
阅读全文
摘要：1.axios的配置 main.js 2. 组件中的使用 Home.vue 3.静态数据 4.效果图
阅读全文
摘要：1.创建 store 结构 2.main.js 引入 vuex 3. App.vue 组件使用 vuex 4.store （1）index.js 入口文件 （2）type.js 状态(类型) （3）actions.js 管理事件(行为) （4）mutations.js 突变 （5）getters.j
阅读全文
摘要：1.项目结构 2.main.js 3.入口文件 App.vue 4.组件部分 components （1）Nav.vue （2）Footer.vue （3）Home.vue 首页 （4）Follow.vue 关注页 （5）Column.vue 栏目页 （6）UserInfo.vue 我的页 5.路由
阅读全文
摘要：vue仿手机新闻站： 做项目基本流程： 1.规划组件结构 2.编写对应路由 3.具体写每一个组件功能 建议：一些公共文件 jquery,jquery插件，一般在index.html文件里面引入 项目需要的模块： 重新缕缕： 路由： 数据请求 axios 可以配置 .
阅读全文
摘要：vuex: 集中式管理数据 官网: http://vuex.vuejs.org/ 流程图 Actions事件(行为) -- Mutations突变 -- State状态 安装：npm install vuex --save vuex提供了两个非常靠谱方法 mapActions 管理所有事件(行为)
阅读全文
摘要：npm install --save react-navigation （1）新建HomeScreen.js （2）新建MainPage.js （3）新建MinePage.js （4）编写TabBarItem.js （5）编写ChatScreen.js （6）编写MyNotificationsScr
阅读全文
摘要：1.react-native run-android 失败 * What went wrong:Execution failed for task ':app:mergeDebugResources'.> Error: java.util.concurrent.ExecutionException:
阅读全文
摘要：vue2.0: bower info vue http://vuejs.org/ 到了2.0以后，有哪些变化? 1. 在每个组件模板，不在支持片段代码 组件中模板: 之前: 现在: 必须有根元素，包裹住所有的代码 2. 关于组件定义 Vue.extend 这种方式，在2.0里面有，但是有一些改动，这
阅读全文
摘要：在打包之前需要修改一个地方，那就是config->index.js文件，修改assetsPublicPath: '/'为assetsPublicPath: './',截图如下 上面文件改好后，开始打包，执行如下命令： 生成 dist 文件夹 1.使用 cordova 打包 （较为复杂，安全，需要配置
阅读全文
摘要：由于项目中用到了豆瓣api,涉及到跨域访问，就需要在config的index.js添加代理,例如 安装axios 在main.js引入axios 在各个组件里获取数据，就是这么简单 由于豆瓣app首页的数据，我们不能直接通过api获取数据，只能先将数据保存下来进行访问，大家做项目的时候，访问静态数据
阅读全文
摘要：1.组件cell 这里的cell分为三种样式，左侧带图标，不带图标，以及左侧带竖线的cell。 每一个组件都有一个底部边框： 这里我们采用了移动端1px像素问题的解决方法：父级元素设置相对定位，构建1个伪元素,设置绝对定位， 将它的长宽放大到2倍, 边框宽度设置为1px, 再以transform缩放
阅读全文
摘要：swiper中文文档：http://www.swiper.com.cn 1.我们在components文件夹里创建一个swipe组件，将需要用到的js以及css文件复制到assets/lib文件夹下，如图： 然后根据swiper的使用方法：http://www.swiper.com.cn/usage
阅读全文
摘要：1.分析 首页的header背景是绿色的，并且有一个搜索框，其他页面都是灰色的背景，在header的左侧，是一个返回按钮，右侧，有分享或者评论等图标，中间就是header的标题。我们先不做有搜索框的header。 我们先在components文件中创建一个header.vue文件，并且在less文件
阅读全文
摘要：1.大体布局 这个组件分为两部分：第一个是组件的外层容器，第二个是组件的子容器item，子组件里面又分为图片和文字组合。子组件有2个状态，一个默认灰色的状态，一个选中状态，我们来实现一下这个组件的布局 Index.vue 效果图： 2.组件化 先在components文件夹下面，新建两个组件，通过这
阅读全文
摘要：1.创建豆瓣项目 我们通过官方vue-cli初始化项目 填写项目描述，作者，安装vue-router 初始化后，通过npm install安装依赖 由于我们是做的移动端，所以在index.html里面加上meta 运行项目 2.布局 解压豆瓣app获得他的一些图片素材，拷入到src/assets/i
阅读全文
摘要：一、开源库介绍 react-navigation据称有原生般的性能体验效果。 该库包含三类组件： 二、react-navigation使用 具体内容大致分为如下： 1、StackNavigator属性介绍 注：大家可能对于path不太理解。path属性适用于其他app或浏览器使用url打开本app并
阅读全文
摘要：1.属性 animationType（动画类型） PropTypes.oneOf([‘none’, ‘slide’, ‘fade’]) none：没有动画 slide：从底部滑入 fade：淡入视野 onRequestClose（被销毁时会调用此函数）Platform.OS ’android’？Pr
阅读全文
摘要：1.通过 AsyncStorage 将值保存在本地（最低端的方法） 2.定义成员属性 通过 props 传值（父组件向子组件传值） CommunalCell.js 定义成员属性 接收外部传值 引用 传值 3.通过回调方法传值 （子组件向父组件传值） 子组件 父组件 .
阅读全文
摘要：1.效果图 2.数据 SettingData.json 3.组件代码 .
阅读全文
摘要：CommunalChart.js .
阅读全文
摘要：1.下载插件 2.项目结构 3.redux 适用于 多交互，多数据源，复杂程度高的工程中。 redux 必要知识 使用 redux 之前，基本的东西还是要都懂的，数据流向介绍： Action：行为。它的作用就是将我们更新组件的 状态(state) 的每个动作抽象为一个行为，它有一个必须的参数 typ
阅读全文
摘要：1.生成一个签名密钥： 在 /android/app 下运行 说明：keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000 注
阅读全文
摘要：1.removeClippedSubviews 用于提升大列表的滚动性能。需要给行容器添加样式overflow:’hidden’。（Android已默认添加此样式）此属性默认开启 这个属性是因为在早期 ListView 在数据到达一定程度的时候就会越来越卡，最终导致 APP 崩溃退出，使用这个属性后
阅读全文
摘要：1.TabBarItem 逻辑完善 那么为了更好的用户体验，我们这边还需要来处理一下点击 TabBarItem 的一下细节，那就是当用户点击 Item 时，可能只是单纯的想进行页面的 切换或者置顶操作 ，而不想进行 刷新，那么我们就需要来判断一下什么时候需要刷新，什么时候需要置顶。 那么我们可以通过
阅读全文
摘要：监听 TabBarItem 点击与传值实现 点击 Item 进行刷新功能 原版 APP 中当我们点击 首页和海淘 2个 Item 时，会马上获取最新数据个数然后进行更新，这边来实现一下这个功能。 1.通过通知的方式监听Item点击做相应的操作，所以我们在需要接收通知的页面注册一下通知，在需要的地方发
阅读全文
摘要：小时风云榜按钮处理 在服务器返回给我们的 json 数据中，提供了 hasnexthour 字段，当这个字段返回为 1 的时候，表示后面还有内容，按钮可以点击，否则不能点击，按照这个思路，我们就来完成这个功能。 步骤一：在 state 中新增 isNextTouch 状态 步骤二：在每次请求成功后都
阅读全文
摘要：1.首页筛选功能 GDCommunalSiftMenu.js 2.数据源： HomeSiftData.json HTSiftData.json 3.调用 GDHome.js 效果图： GDHt.js 效果图： .
阅读全文
