day03

1.一级分类添加背景颜色
第一种:采用样式完成
        .item:hover {
          background-color: skyblue;
第二种:采用js完成
待定
2.js控制二三级分类的显示与隐藏
1.最开始通过css的display:显示与隐藏
 // &:hover {
          //   .item-list {
          //     display: block;
          //   }
          // }
2.通过js控制
 
     


       

         

            <h3 @mouseenter=“changeIndex(index)”>
               
              {{ c1.categoryName }}
           
           
           

             

data() {
    return {
      //存储用户鼠标移动哪一个位置
    currentIndex:-2
    }

},
 methods:{
    // 鼠标进入修改响应式curentIndex属性
    changeIndex(index){
    //index,鼠标移动到某一个一级分类
    this.currentIndex = index;
    }
  }

3.卡顿现象
正常情况:用户慢慢的操作,鼠标进入,每一个一级分类都会触发鼠标进入事件
非正常情况:用户的操作很快,本身所有的以及分类都应该触发,但实际操作只有部分触发
由于用户的行为过快,导致浏览器反应不过来,如果当前的回调函数中有很多的业务,有可能出现卡顿现象
3.1函数防抖
前面的所有的触发都被取消,最后一次执行在规定的时间之后才能触发
简单来说:如果快速触发,只会触发一次
3.2函数节流
在规定的间隔时间范围内不会重复触发回调,只有大于这个时间间隔才能触发回调,把频繁触发变为少量触发
3.3lodash插件
里面封装了函数的 防抖和节流的业务【闭包和延迟器】
lodash函数对外暴露_函数
//防抖
官网—》》函数–》》debounce—》》func,wait,option
let result = _.debounce(function(){

console.log("我在一秒后执行一次");

},1000);
result();

//节流
官网—》》函数—》》throttle–》》wait,option
button.οnclick= _.throttle(function(){

console.log("我在一秒只能执行一次");

},1000);
result();

4.三级联动节流
// 这种引入的方式,是把lodash全部的功能函数引入
// import _ from ‘lodash’;
// 最好的方式,按需引入
import throttle from “lodash/lodash”

methods:{
    // 鼠标进入修改响应式curentIndex属性
    // changeIndex(index){
    // //index,鼠标移动到某一个一级分类
    // this.currentIndex = index;
    // }  es6

changeIndex:throttle(function(index){
  //index,鼠标移动到某一个一级分类
    this.currentIndex = index;
    },50)
    // es5
  }
5.三级联动组件的路由跳转和传递参数
三级联动用户点击:一级分类、二级分类、三级分类
当点击的时候,会从home模块跳转到search模块,一级会把用户选中的产品(产品的名、产品的id)在路由的跳转的时候,进行传递。
路由跳转:
声明式导航:router-link
编程式导航:push | replace
三级联动:如果使用声明式导航router-link,可以实现路由的跳转与传递参数。
但是需要注意:出现卡顿现象
router-link:当服务器的数据返回之后,选混出很多的router-link组件,
创建组件实例的时候,一般创建1000+很好内存的,因此出现了卡顿现象。
<a @click=“goSearch” href=“”>{{ c1.categoryName }}
goSearch(){
    // 进行路由跳转的方法
    this.$router.push(‘/search’);
  }
方法二:

       

goSearch(event) {
      // 进行路由跳转的方法
      // this.KaTeX parse error: Expected '}', got 'EOF' at end of input: …转         this.router.push(location);
      }
    },

{{ c1.categoryName }}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
自动控制节水灌溉技术的高低代表着农业现代化的发展状况,灌溉系统自动化水平较低是制约我国高效农业发展的主要原因。本文就此问题研究了单片机控制的滴灌节水灌溉系统,该系统可对不同土壤的湿度进行监控,并按照作物对土壤湿度的要求进行适时、适量灌水,其核心是单片机和PC机构成的控制部分,主要对土壤湿度与灌水量之间的关系、灌溉控制技术及设备系统的硬件、软件编程各个部分进行了深入的研究。 单片机控制部分采用上下位机的形式。下位机硬件部分选用AT89C51单片机为核心,主要由土壤湿度传感器,信号处理电路,显示电路,输出控制电路,故障报警电路等组成,软件选用汇编语言编程。上位机选用586型以上PC机,通过MAX232芯片实现同下位机的电平转换功能,上下位机之间通过串行通信方式进行数据的双向传输,软件选用VB高级编程语言以建立友好的人机界面。系统主要具有以下功能:可在PC机提供的人机对话界面上设置作物要求的土壤湿度相关参数;单片机可将土壤湿度传感器检测到的土壤湿度模拟量转换成数字量,显示于LED显示器上,同时单片机可采用串行通信方式将此湿度值传输到PC机上;PC机通过其内设程序计算出所需的灌水量和灌水时间,且显示于界面上,并将有关的灌水信息反馈给单片机,若需灌水,则单片机系统启动鸣音报警,发出灌水信号,并经放大驱动设备,开启电磁阀进行倒计时定时灌水,若不需灌水,即PC机上显示的灌水量和灌水时间均为0,系统不进行灌水。
智慧农业是一种结合了现代信息技术,包括物联网、大数据、云计算等,对农业生产过程进行智能化管理和监控的新模式。它通过各种传感器和设备采集农业生产中的关键数据,如大气、土壤和水质参数,以及生物生长状态等,实现远程诊断和精准调控。智慧农业的核心价值在于提高农业生产效率,保障食品安全,实现资源的可持续利用,并为农业产业的转型升级提供支持。 智慧农业的实现依赖于多个子系统,包括但不限于设施蔬菜精细化种植管理系统、农业技术资料库、数据采集系统、防伪防串货系统、食品安全与质量追溯系统、应急追溯系统、灾情疫情防控系统、农业工作管理系统、远程诊断系统、监控中心、环境监测系统、智能环境控制系统等。这些系统共同构成了一个综合的信息管理和服务平台,使得农业生产者能够基于数据做出更加科学的决策。 数据采集是智慧农业的基础。通过手工录入、传感器自动采集、移动端录入、条码/RFID扫描录入、拍照录入以及GPS和遥感技术等多种方式,智慧农业系统能够全面收集农业生产过程中的各种数据。这些数据不仅包括环境参数,还涵盖了生长状态、加工保存、检验检疫等环节,为农业生产提供了全面的数据支持。 智慧农业的应用前景广阔,它不仅能够提升农业生产的管理水平,还能够通过各种应用系统,如库房管理、无公害监控、物资管理、成本控制等,为农业生产者提供全面的服务。此外,智慧农业还能够支持政府监管,通过发病报告、投入品报告、死亡报告等,加强农业产品的安全管理和质量控制。 面对智慧农业的建设和发展,存在一些挑战,如投资成本高、生产过程标准化难度大、数据采集和监测的技术难题等。为了克服这些挑战,需要政府、企业和相关机构的共同努力,通过政策支持、技术创新和教育培训等手段,推动智慧农业的健康发展。智慧农业的建设需要明确建设目的,选择合适的系统模块,并制定合理的设备布署方案,以实现农业生产的智能化、精准化和高效化。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值