左联右动==dome

<template><view><view class="serch"><button @click="serchBtn" type="default">搜索</button></view><!-- 分类 --><view class="list"><scroll-view scroll-y="true" class="left"><view @click="tabBtN(index,item.cat_id)" v-for="(item,index) in typeList":class="cur===index?'active' : ''" :key="item.cat_id"><text>{{item.cat_name}}</text></view></scroll-view><scroll-view scroll-y="true" class="right" :scroll-into-view="id"><view v-for="(item,index) in typeList" :key="item.cat_id" :id="'goods_0'+item.cat_id"><view class="item-list" v-for="(ite,index) in item.children" :key="ite.cat_id"><view class="title">/{{ite.cat_name}}/</view><view @click="listBtn(it.cat_id)" class="right-item" v-for="it in ite.children":key="it.cat_id"><image class="image" :src="it.cat_icon" mode="widthFix"></image><view class="text-name">{{it.cat_name}}</view></view></view></view></scroll-view></view></view>
</template><script>import {gettypedata} from "../../utils/api"export default {data() {return {typeList: [], //分类的数据cur: 0, //索引id: 'goods_0'};},onLoad(options) {this.getdata();},methods: {// 分类的请求函数getdata() {gettypedata().then(res => {console.log(res);this.typeList = res.message})},// 左侧样式tabtabBtN(i, id) {this.cur = ithis.id = 'goods_0' + id},// 跳转搜索页serchBtn() {uni.navigateTo({url: '../serch/serch'})},listBtn(id) {uni.navigateTo({url: '../pages/goods_list?cid=' + id})},},}
</script>

左联右动==dome相关推荐

数据库内联左联右联 INNER JOIN、LEFT JOIN和RIGHT JOIN
相信很多人在刚开始使用数据库的INNER JOIN.LEFT JOIN和RIGHT JOIN时,都不太能明确区分和正确使用这三种JOIN操作,本文通过一个简单的例子通俗易懂的讲解这三者的区别,希望对大 ...
mysql左联右联区别_Mysql----关于内联，左联，右联，全联的使用和理解
准备工作:新建两张表表一:student 填充内容:编号,姓名,班级表二:school 填充内容:编号,班级,专业这两张表建好了,意为班级选课表,两张表没有任何主外键的关系,下面进行内联,左联, ...
sql语句内联左联右联的区别
今天sql操作遇到了这个问题,详细总结一下: 现数据库里有这样两个表: 内联查询: inner join...on/where sql语句:SELECT * FROM t_user INNER JOI ...
mysql 左联右联一块_MySQL联合查询语法（内联、左联、右联、全联）
MySQL联合查询效率较高,以下例子来说明联合查询(内联.左联.右联.全联)的好处: T1表结构(用户名,密码) userid(int) usernamevarchar(20) passw ...
mysql的内联与左联,SQL联合查询（内联、左联、右联、全联）的语法
SQL联合查询(内联.左联.右联.全联)的语法以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧! 概述联合查询效率较高举 ...
动效设计原理：从卡通动画到UI动效
UI是基于静态页面来设计的,页面之间通过跳转切换.在设计过程中,设计师很重视单页的视觉效果,却经常忽略了对界面跳转的处理.这些未经处理的跳转由于没有提供足够的预期,所以用户在使用时经常会觉得困惑.与 ...
vue实现商品分类左右联动
vue中better-scroll实现商品分类左右联动结合better-scroll插件实现商品分类左右联动交互方式. 文章目录 vue中better-scroll实现商品分类左右联动前提准备效 ...
科大奥锐干涉法测微小量实验的数据_光学干涉观测精确丈量宇宙 | 赛先生天文...
图源:pixabay.com 编者按自古以来,人类从未停止过探索宇宙的脚步.每当抬头望向那片令康德"震撼心灵的灿烂星空"时,总能勾起人们对她的各种思索,这些闪烁着的繁星到底离我们 ...
三关节机械臂控制需求说明压缩文件中的相关文档说明
▌01 机械臂控制需求先驱威锋公司的小吕(微信号:南天)发送过来机械臂控制需求说明文档,其中包括有: 01机械臂当前需求以及后续开发需求.docx 02机械臂测试说明.docx 03机械臂定位方案2 ...

左联右动==dome

左联右动==dome相关推荐

最新文章

热门文章