Articles in the category of Web开发

web前端
  1. Home
  2. Web开发

vue项目中实时监测浏览器滚动条的高度

**1、在mounted生命周期函数注册滚动条事件**```javascript mounted() { window.addEventListener('scroll', this.windowScroll) } ```**2、在methods方法里使用**```javascript methods: { windowScroll() { // 滚动条距离页面顶部的距离 // 以下写法原生...
  • 逸云先生
  • January 16, 2021
  • No comments

    • 在vue里面安装swiper以及踩得坑

    **前言**：最近在vue里面安装swiper，发现最佳配置是：> swiper：5.4.3 > > vue-awesome-swiper: 4.1.1官网安装方法：`yarn add swiper vue-awesome-swiper`这边我推荐大家安装：``` yarn add swiper@5.4.3yarn add vue-awesome-swiper@4.1.1 ```如果已经安装...
  • 逸云先生
  • January 14, 2021
  • No comments

    • vue之父子组件传值

    ### **父组件向子组件传值**#### 这是父组件``` import son from './son.vue'; export default { components: { son, }, data() { return { title: '我是父组件的传过来的值', }; }, }; ...
  • 逸云先生
  • December 31, 2020
  • No comments

    • JavaScript实现背景随机线条效果

    ``` * { margin: 0; padding: 0; } var canvas = document.getElementById("cas"); var ctx = canvas.getContext("2d"); resize(); window.o...
  • 逸云先生
  • December 29, 2020
  • 1 comments

    • vue的一些库

    vue-backtotop：vue返回顶部的库vue-notification：vue消息弹窗vue-vuelidate: vue实现表单验证vue-is-mobile：vue判断是否是移动端待补充...
  • 逸云先生
  • December 14, 2020
  • No comments

    • javascript里面2种方法实现模糊查询数组和对象

    ## 第一种：#### html部分：```{{item}}```#### js部分：``` var vm = new Vue({ el: '#app', data: { sreach:'', list: [ 'html', 'css','js' ], }, computed: { find() { return this.list.filter(item=> item.indexOf(th...
  • 逸云先生
  • December 9, 2020
  • 1 comments

    • html,css,js实现自适应手机端导航

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale...
  • 逸云先生
  • November 28, 2020
  • No comments

    • 如何用纯CSS动画实现slide down效果？

    ### 使用 `max-height top...`配和 `transition`**设置定宽**``` .more { -webkit-transition: max-height .35s ease-in-out; -moz-transition: max-height .35s ease-in-out; -o-transition: max-height .35s ease-in-ou...
  • 逸云先生
  • November 19, 2020
  • No comments