第三周周总结

本周主要是根据学长的安排进入了流量开发小组，主要是对接天翼云后端api进行监听器部分的功能点开发以及创建后端服务器组的功能点实现。

创建监听器

首先是创建监听器的页面，它包含五个步骤，每个步骤都分了单独的页面。由此我将文件分为主文件index.vue和五个步骤的页面文件。主文件便负责了各种页面的数据的请求以及最后创建监听器的请求。

同时此功能点每个步骤间有各类数据的关联，其难点便在于对各组件之间传值的方式的书写。这里我使用的是defineProps结合 defineEmits的方式实现各个组件之间的数据同步的。因为本身Vue 3支持多个v-model绑定，因此可实现更简洁的双向数据流：

子组件代码

<script setup>
defineProps(['modelValue']);
defineEmits(['update:modelValue']);
</script>

<template>
  <input 
    :value="modelValue"
    @input="$emit('update:modelValue', $event.target.value)"
  >
</template>

父组件代码

<script setup>
import { ref } from 'vue';
import VModelChild from './VModelChild.vue';

const parentValue = ref('');
</script>

<template>
  <VModelChild v-model="parentValue" />
  <p>v-model绑定的值：{{ parentValue }}</p>
</template>

创建后端组实际是四个步骤汇总的页面，此处的难点在于穿梭框的配置以及会话保持按钮的业务逻辑。会话保持模式按钮对应一个对象，其中sessionStickyMode为会话保持模式，支持取值：CLOSE（关闭）、INSERT（插入）、REWRITE（重写），SOURCE_IP（源地址），当 algorithm 为 lc / sh 时，sessionStickyMode 必须为 CLOSE。当主机组协议类型为tcp/udp时，若要开启会话保持，仅支持SOURCE_IP。因此我要在不同的按钮配置环境下为用户展现不同的下拉框或者禁用按钮。

教训

本周学习最深刻的部分，同时也是我最得到教训的一部分。

开始初期的开发为我展示的是一个对天翼云的openapi进行二次封装后的页面（翼龙的页面）。然后让我们前端按照页面进行开发。可是页面基本开发结束后在对接后端api时却出现的大问题，很多缺字段或者多字段的请求，搞得我手足无措，周三的时间基本上在纠结这个。后面向学长反应了这个问题，在周五的时候才进行了开会，重新仔细看了一下别人的页面的请求才发现根本是进行了二次封装的。而后端又完完全全是按照最原始的openapi进行开发的，因此导致前后端根本对不上。最后无奈砍需求，改页面。而我本身最开的逻辑比较复杂，导致后续改请求的时候手忙脚乱，同时也是比较急的项目。最后我将能写的代码都写好了(有几个请求因为后端仍然直接返回字符串或者创建请求返回空值被响应拦截器拦截而无法撰写，只写了逻辑)merge上了分支。因为我下周是完完全全的一整周的学校安排的电装实习，导致我下周没时间工作。

总而言之本次最大的教训是积极互动的问题以及开发流程的问题。由于我还残存着之前一个人写前后端的思维，导致前端页面的开发都是占主导，再根据前端来设计后端。这个思想并不正确，我以后接手功能点或者项目的时候，首先应该利用apipost等软件对请求进行简单的了解，了解后端实际会返回什么数据，实际需要我传什么数据，发现对不上的地方再提出问题。而不是一股脑先做完页面，发现问题再手忙脚乱的改代码。同时也应该积极和后端学长交流，遇到请求问题应该以“GET api/get/server 问题描述"这种方式去与他交流，才能提高开发效率。

当然本周我也熟练了各种分支的操作，自己开分支，合并分支，拉取分支。这些操作加强了我作为一个开发者的基本素养与能力。

总结

下周由于电装实习请假，没法进行实习，但是下下周我应该是可以以一个饱满的状态进行开发的。经历了上周磕磕绊绊且一波三折的开发经历，我在后续开发的时候应该保持一个良好的业务习惯，杜绝掉以前一个人开发留下的小毛病。同时也要加强对于后端api文档的读取能力，仔细阅读，不能遗漏任何一个细节，保持小心谨慎。同时加强我的代码习惯，增加我代码的可读性，便于后期的调整修改。