项目第五天

1.频道数据持久化

添加频道思路：

• 如果未登录，则存储到本地
• 如果已登录，则存储到线上
  • 找到数据接口
  • 封装请求方法
  • 请求调用

删除频道思路：

• 如果未登录，则存储到本地
• 如果已登录，则存储到线上
  • 找到数据接口
  • 封装请求方法
  • 请求调用

2.文章搜索

先创建组件并配置路由布局页面

申明变量isShow来条件渲染

搜索联想建议

1、获取并监视内容变化

2、请求获取展示数据

3、防抖优化

lodash的使用

1.安装lodash

2.引入debounce 防抖函数

4、搜索关键字高亮

const str = "Hello World"

// 结果：<span style="color: red">Hello</span> World
"Hello World".replace('Hello', '<span style="color: red">Hello</span>')

// 需要注意的是，replace 方法的字符串匹配只能替换第1个满足的字符
// <span style="color: red">Hello</span> World Hello abc
"Hello World Hello abc".replace('Hello', '<span style="color: red">Hello</span>')

// 如果想要全文替换，使用正则表达式
// g 全局
// i 忽略大小写
// <span style="color: red">Hello</span> World <span style="color: red">Hello</span> abc
"Hello World Hello abc".replace(/Hello/gi, '<span style="color: red">Hello</span>')