vue-element-ui下拉框返回对象

起因  原本并不需要考虑这种形式,但是无奈后端提供的接口数据并没有描述相关的配置项。 需求是在一个form中的select被选择后(具体数据是一个IP地址),以popover的形式显示包含这个IP地址的对象的全部信息。众所周知,select中的option备选项是一个数组,比如我在created()阶段收到的数组元素之一如下: { host_name: "第一台测试服务器", host_type: 0, id: 1, location: "香港", private_ip: "10.78.100.5", public_ip: "100.100.100.100:9527" } 处理选择  那么很显然,在option标签中,使用v-for取出item就可以渲染出这些备选项,而select组件已经为我们绑定了表单数据,在之前定义的:value=“item.public_ip”就代表填充到表单里的值,是我要的IP地址。  但是数据预览的需求是,不仅要看到IP地址,还要看到host_name、host_type、id这些json数组对象中的其他信息,  可是并没有提供映射的配置信息,所以我···用到了: :value=“item” 可是这里要注意,此时的item是一个对象,那么在外层的select中,要添加这个属性 value-key=“public_ip” 值应该是item对象里的唯一值,不然你连编译都别想过~  那么现在点击了选项后,select会把数据绑定在我定义的中间变量里 selected_center_or_edge_hosts  本来这个变量应该是直接在form表单变量中的数组就可以了,但是为了存下所有的item信息,并且提交表单的时候, 后端哥也懒得处理解析json中的IP地址—总之就是让我多解析一步都不行···  于是就想了一个折中的这个变量,选中的所有值都给它给它给它!  所以我绑定了一个方法,当选择的值发生变化,就会执行里面的动作: 1、先给select绑定方法,传递事件: @change=“change_selected_center_or_edge_hosts($event)” 2、之后定义执行动作: change_selected_center_or_edge_hosts(e) { this.form.center_or_edge_hosts = this.selected_center_or_edge_hosts.map(x => { return x.public_ip }) // 生成数组 } 这里就很明显了,我把选中的item数组中的public_ip取出来,赋值给了form表单里的原本该传的数组。 处理预览  至于预览,在select外层包裹一个popover + table的组件就可以了,但是这样的话一定要记得在select上添加这个属性: slot=“reference” 不然你别想再看到你的select选择器了! 提交请求后的清空处理  当执行了onSubmit之后,正常只要将this.form置空就行了,但是由于有selected_center_or_edge_hosts的存在,  所以我们也要将它置空,而这个需求其实还会要求当一个form中的radio-group切换时,这个select的备选选项数组也要变,所以在切换radio的时候,它的change方法里,也要置空selected_center_or_edge_hosts,不然你休想提交正确的信息了! vue代码 <el-form-item label="填坑的文本标题" prop="center_or_edge_hosts" > <el-popover placement="top-start" trigger="hover" width="800" > <el-table :data="selected_center_or_edge_hosts"> <el-table-column width="50" property="id" label="id" /> .

阅读全文

Adb

ADB命令(Android Debug Bridge) 显示系统中全部设备 adb devices 这个命令是查看当前连接的设备, 连接到计算机的android设备或者模拟器将会列出显示 安装一个apk adb install -r (APK路径) -r 代表如果apk已安装,重新安装apk并保留数据和缓存文件。apk路径则可以直接将apk文件拖进cmd窗口,记得加空格 直接卸载 adb uninstall (apk包名) 卸载 app 但保留数据和缓存文件 清除应用数据与缓存 adb shell pm clear (apk包名) 强制停止应用 adb shell am force-stop (apk包名) 重启设备 adb reboot 删除文件 adb shell cd sdcard/model/book ls rm -r 415 pull和push文件 adb push (文件路径) (想要push的路径) adb pull (文件路径) (想要pull的路径) 查看日志 adb logcat -v threadtime 过滤日志 adb logcat -v threadtime | grep (关键字) 投屏(用于电脑控制设备) 打开vysor adb shell am start -n com.

阅读全文

Jmeter

下载jmeter最新版 https://jmeter.apache.org/download_jmeter.cgi 修改配置文件 vim apache-jmeter-5.1.1/bin/jmeter.properties 找到server.rmi.ssl.disable 这行,去掉前的#,并且把它的值由默认的False改为true 找到remote_hosts 这行,去掉前面的#,并且把它的值由默认的127.0.0.1改为10.0.11.200:1099(这是负载机的内网IP) 以下为jmeter5.1的例子 257 # Remote Hosts - comma delimited 258 remote_hosts=10.0.11.200:1099 259 #remote_hosts=localhost:1099,localhost:2010 260 261 # RMI port to be used by the server (must start rmiregistry with same port) 262 #server_port=1099 263 264 # To change the port to (say) 1234: 265 # On the server(s) 266 set server_port=1234 267 start rmiregistry with port 1234 Q & A 自己机器上看不到响应信息怎么办? 修改配置如下:

阅读全文

Jenkins

重要命令 解决报告样式问题执行: System.setProperty(“hudson.model.DirectoryBrowserSupport.CSP”, “”) println(Jenkins.instance.pluginManager.plugins) mvn向jmeter传递参数的实际命令: pom文件中要添加: <!--设置报告生成的路径--> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <jmeter.result.jtl.dir>${project.build.directory}\jmeter\results</jmeter.result.jtl.dir> <jmeter.result.html.dir>${project.build.directory}\jmeter\html</jmeter.result.html.dir> <performancetest.threadCount>1</performancetest.threadCount> <performancetest.loopCount>1</performancetest.loopCount> <performancetest.key>1</performancetest.key> </properties> <!--执行配置文件--> <profiles> <profile> <id>jenkins</id> <!--<properties>--> <!--<performancetest.threadCount>1</performancetest.threadCount>--> <!--<performancetest.loopCount>1</performancetest.loopCount>--> <!--<performancetest.key>1</performancetest.key>--> <!--</properties>--> </profile> </profiles> <build> <plugins> <plugin> <groupId>com.lazerycode.jmeter</groupId> <artifactId>jmeter-maven-plugin</artifactId> <version>2.5.0</version> <configuration> <!-- 设置jmeter生成结果文件格式--> <resultsFileFormat>xml</resultsFileFormat> <!-- 设置忽略失败是否停止运行--> <ignoreResultFailures>true</ignoreResultFailures> <!--设置结果是否有时间戳--> <testResultsTimestamp>true</testResultsTimestamp> <testFilesIncluded> <!-- //指定运行的jmeter脚本 --> <jMeterTestFile>*.jmx</jMeterTestFile> </testFilesIncluded> <!-- 指定jtl生成目录 --> <resultsDirectory>${jmeter.result.jtl.dir}</resultsDirectory> <propertiesUser> <threadCount>${performancetest.threadCount}</threadCount> <loopCount>${performancetest.loopCount}</loopCount> <key>${performancetest.key}</key> </propertiesUser> </configuration> <executions> <execution> <id>jmeter-tests</id> <!--脚本所在的文件夹 --> <goals> <goal>jmeter</goal> </goals> </execution> </executions> </plugin> <plugin> <!

阅读全文

Odin

起源 Odin平台起源于cm测试团队的不开源行为 三人分工为1前端,2后端在原来基础上进行了升级。 本项目基于vue-element-admin二次开发,先后破解了登录权限、侧边栏、axios请求拦截等操作。

阅读全文

Govendor

安装govendor go get -u -v github.com/kardianos/govendor 运行 govendor 检测安装结果 govendor 初始化 govendor init 收集依赖包 go add +external 安装部署govendor项目 进入git clone完成后的项目目录下 govendor sync 不过貌似也不需要,只要vendor目录在项目目录下即可

阅读全文

作者的图片

CooperHsu

苦逼热力测绘院

测试经理*全栈测开*打杂

望京甘道夫