(3.13——3.15)本周前半段总结

周一

1.学习pinia

学习笔记:http://t.csdn.cn/Va1Sn

2.配置项目菜单即子菜单的路由跳转。

3.学习由于菜单栏收起页面宽度变大进行子页面的自适应,在进行echarts图表的自适应过程中遇到了bug,学长说可能是编译器的问题,然后我就把重新导包结果出bug了,后面找了很久把npm降级了几个版本,重新npm install才弄好。最后感觉这个库可能是没在维护了,所以弃用了,晚上搞这个稍微浪费了点时间。


周二

1.Vue3 script setup 语法糖

听学长的建议,今天先是学习了Vue3 script setup 语法糖。

学习笔记:http://t.csdn.cn/S2Zyg

2.和队友讨论了子页面中子菜单的放置位置和样式调整。 

3.逐个摸索了以下平台的标签管理和阿里云的子用户管理相关页面,参考讨论过后确定了比赛项目中这两个页面的原型图。

1.百度指数需要开通购买标签管理API          ✖‘

2.微信公众号后台 无公众号 无法进入后台   ✖‘

3.大众点评即知乎话题管理同上                    ✖‘

4.github开拓标签功能需要升级至专业版      ✖‘

5.豆瓣的标签只有最基础的在添加资源时选择或创建标签功能,没有管理页面。✖‘

6.后面又去看了熟悉的csdn,基本上都是对专栏收藏之类的管理,没看到标签管理,最后重新结合项目需要做Object的标签,可以通过标签索引到相关的内容列表并进行具体内容的跳转。

 

 权限控制这里比较复杂

关键需要明白两个东西Bucket ACL和Object ACL

Bucket ACL

读写权限ACL用于定义用户或用户组被授予的访问权限。收到某个资源的请求后,OSS会检查相应的ACL以验证请求者是否拥有所需的访问权限。您可以在创建存储空间(Bucket)时设置Bucket ACL,也可以在创建Bucket后根据自身的业务需求修改Bucket ACL。仅Bucket拥有者可以执行修改Bucket ACL的操作。

tip:

  • 如果您在上传文件(Object)时未指定文件的ACL,则文件的ACL均默认继承Bucket ACL。
  • 修改Bucket ACL会影响Bucket内所有ACL为继承Bucket的文件。

 和队长交流了,他这里参考阿里云但比阿里云多设置了两种权限

公共读写:任何人都可以对该Bucket内文件进行读写操作。

RAM读写:用户和子用户都可以对该Bucket内文件进行读写操作。

公共读:只有该Bucket的拥有者可以对该Bucket内的文件进行写操作,任何人都可以对该Bucket中的文件进行读操作。

RAM读:只有该用户的Bucket的拥有者与其子用户可以对该Bucket内的文件进行写操作,任何人都可以对该Bucket中的文件进行读操作。

私有:只有Bucket的拥有者可以对该Bucket内的文件进行读写操作,其他人无法访问该Bucket内的文件。

Object ACL

读写权限ACL用于定义用户或用户组被授予的访问权限。收到某个资源的请求后,OSS会检查相应的ACL以验证请求者是否拥有所需的访问权限。您可以在上传Object时设置相应的ACL,也可以在Object上传后的任意时间内根据自己的业务需求随时修改ACL。

注意事项

  • 如果没有设置Object的权限,即Object的ACL为default,Object的权限和Bucket的权限一致。
  • 如果设置了Object的权限,Object的权限大于Bucket的权限,则以设置的Object的权限为准。例如,设置了Object的权限是public-read,则无论Bucket是什么权限,该Object都可以被身份验证访问和匿名访问。  

周三

1.原型图基本画完了。还剩下一些按钮的操作交互。

2.为了实现进入内子页面时,改变其父组件中的面包屑导航,昨天学习了vue3中的setup语法糖,今天就用昨天学的defineEmits进行了向父组件传入插入代码事件,实现思路就是内子页面给父组件传输需要追加的面包屑导航html代码,父组件子只需要监听viewRouter上的subAppendHtml方法,然后在父组件中定义在面包屑导航后插入代码的方法即可。

没想到的是vue3+setup语法糖中插入html代码一直一直一直弄不好,查了很多博客也没解决。要么就是无响应要么就是报错。用ref获取元素再追加没用,使用v-html没用,获取dom元素然后appendChild也没用。

由于vue中几乎不进行动态追加代码,决定弃用该方法。学长提示之后,决定将面包屑导航封装成全局组件,通过路由去读取每一段面包屑的参数。

成功封装好了面包屑导航组件,并实现了所有页面根据路由自动配置面包屑导航的各个字段以及跳转。

由于数据大屏页面的背景颜色不同于其他页面,而面包屑导航直接设置在根页面中,底板也直接设置在根页面中,所以今天还学习了vue3+setup中如何监听路由变化来改变根页面的背景颜色样式。

今天解决的这两个点都做了博客笔记复盘。

全局根据路由自动装配面包屑导航封装:http://t.csdn.cn/lDJ7d

vue3+setup中监听路由变化改变样式:http://t.csdn.cn/vViEP

猜你喜欢

转载自blog.csdn.net/m0_62742402/article/details/129503388