摘要:本节目的:从DB获取文章详情渲染到前台界面 1. 创建云函数并在list.js中引入 2. 简单的渲染到页面
阅读全文
摘要:1. 提前获取文章详情,传递给文章详情页 传递数据 接收数据 2. 数据渲染
阅读全文
摘要:1. 创建详情页,并链接 2. 页面布局 代码 <template> <view class="detail"> <view class="detail-title"> 我是一个前端开发者,我到底要不要学习NodeJS? </view> <view class="detail-header"> <v
阅读全文
摘要:1. 加载页面标签时,显示Loading 提示 正在加载效果图 没有数据效果图 页面代码 js代码 2. 标签编辑完成后,首页栏目标签未刷新的问题 2.1 测试自定义事件 标签页发送 首页监听 点击测试 btn,效果图 2.2 使用自定义事件 (删除按钮及edit自定义事件之后) 标签页发送自定义事
阅读全文
摘要:1. 创建云函数update_label,并在list.js中注册 注册 2. 调用云函数更新 user 表字段 (编辑完成后,去数据库查看更新) 3. 完善提示功能
阅读全文
摘要:页面逻辑:点击编辑,实现上面标签与下面标签的对等增删,并在首页只显示我的选定的所有标签作为导航内容。 1. 添加 编辑 点击事件 2. 获取云函数数据,渲染到页面 此时,手动给user表添加一个收藏字段 页面渲染 效果图 用户收藏了 后端开发 的ID 3. 点击编辑,删除或者添加标签
阅读全文
摘要:页面逻辑:加载显示用户自定义显示/收藏的标签。 用户收藏了此标签,则用户表中会添加一个字段 : label_ids: ['label_id'...]; 现在获取label标签,根据用户表中是否有 label_ids 字段,动态给 label表每个标签添加一个 current: true/false
阅读全文
摘要:1. 创建标签管理页面 1.1 创建页面 1.2 标题 1.3 从 tab中点击齿轮跳转 2. 页面代码 3. 样式
阅读全文
摘要:1. 处理搜索页面遗留问题 1.1 搜索页返回事件 1.2 清空历史记录 1.2.1 开发清空函数 1.2.2 搜索页清空事件 1.3 处理 刷新搜索页 搜索历史消失的问题 1.4 去掉红色的边框 1.5 清除重复的历史记录数据(自己添加)
阅读全文
摘要:1. 实现点击卡片存储搜索记录 1.1 list-card传参 1.2 home-seach 接收 此时,页面输入关键词查询,返回数据后点击一下卡片,然后清空输入框,查看 2.点击搜搜历史,实现输入框输入搜索历史内容并搜索 2.1 实现搜索页搜索内容的双向绑定 搜索页传值给navbar navbar
阅读全文
摘要:效果图 1. 搜索历史还是搜索结果控制 2. 仿照get_list获取数据 3.搜索逻辑实现 3.1 限制请求时间 3.2 navbar中,调整搜索框宽度为100% 3.3 创建云函数get_search list.js中 修改home-seach,调用云函数 3.4 home-search循环中添
阅读全文
摘要:效果图: 1. 添加无搜索历史内容及样式 2. input传值给home-search 2.1 navbar 传值 2.2 home-search 接收 3. vuex的使用 3.1 创建目录 store,引入vuex实例 3.2 main.js中注册 3.3 页面调用 historyLists 3
阅读全文
摘要:搜搜页效果图 1. 创建及跳转到搜索页 1.1 创建搜索页 1.2 从导航栏实现跳转 2. 编辑home-search 自定义导航栏 2.1 禁止原生导航 2.2 对home-search页面导航栏修改 2.2.1 navbar传参识别是哪个页面调用,以方便对navbar修改 接收传参 2.3 添加
阅读全文
摘要:1. 刷新页面,保存获取是否收藏的状态 1.1 修改云函数get_list 1.2 模拟传参 1.3 修复get_list 新添加 user_id字段的问题 查看结果:只查看第一项,article 和 user_id 暂时写死的 1.4 最终实现 收藏后刷新页面 数据库查看 1.5 添加页面收藏成功
阅读全文
摘要:效果图: 1. 页面实现 1.1 list-card.vue 1.2 样式 2. 组件化 并在list-card中使用 3 关注事件绑定及阻止冒泡 3.1 list-card定义页面详情页事件 3.2 事件绑定 4. 创建云函数 update_like 4.1 查看数据库结构 4.2 编辑云函数 4
阅读全文
摘要:1. 处理首页显示全部而不是第一个类别 1.1 index.vue中 1.2 修改云函数 效果图: 2. 导航栏点击重复获取数据问题 3. 下载官方loadMore组件并使用 3.1 修改云函数每次返回10条数据 list.vue: 修改云函数get_list: 3.2 添加上拉加载更多 3.2.1
阅读全文
摘要:效果图: 1. list.vue中修改云函数 传参 2. 云函数中 聚合操作 并查看前端变化 3. 解决选项卡切换数据缓存问题 问题:list.vue中,this.list = data,选项卡切换时,data还没获取回来之前,页面还是加载 list中的数据 3.1 新数据存取到新数组中 3.2 修
阅读全文
摘要:效果图: 1. 新建云函数并绑定 1.1 云函数 get_list 1.2 list.js中 1.3 list.vue中使用 1.4 list-item中接收 1.5 list-card接收渲染所有数据 <template> <view> <!-- 基础卡片 --> <view v-if="item
阅读全文