初识vue3之无限滚动
vue3中自定义无限滚动指令与无限滚动组件的封装
初识vue3之响应式数据
关于此分类 关于初识 vue3分类主要是记录一些通过 vue3 进行的实践与学习记录。 此文主要记录关于 vue3 响应式数据的尝试。 本文会随着作者日常使用进行补充及内容修正 refs 类型声明 12345678910111213141516import { ref, Ref } from 'vue'export default { // setup参数参考 https://v3.cn.vuejs.org/guide/composition-api-setup.html#%E5%8F%82%E6%95%B0 setup() { // 声明类型 字符串 const stringVal = ref<string>('1') // 声明类型 数字 const numberVal = ref<number>(1) // 声明类型 泛型 function useState<State extends string>(initia ...
初识vue3之better-scroll组件封装
关于此分类 关于初识 vue3分类主要是记录一些通过 vue3 进行的实践与学习记录。 此文主要记录封装基于BetterScroll 2.0插件封装的 scroll-view 组件。适用于移动端的弹性滚动及下拉刷新、上拉加载等场景。 弹性滚动 下拉加载 上拉刷新 滚动前后及滚动中事件 滚动条（待添加） 本文会随着作者日常使用进行补充及内容修正 简单的实现过程 实现之前需要先明确一下需求： 弹性滚动 下拉刷新、上拉加载 自定义传入内容 事件派发 弹性滚动 实现弹性滚动只需要按照官方示例初始化即可实现。 123456789101112131415161718<template> <div class="wrapper" ref="wrapper"> <div class="content"> <div v-for="i in 100">{{ i ...
一、VUE中的遗漏的知识
render 中的 h 函数 h 函数可以创建虚拟 dom，通过创建的虚拟 dom 再转化为真的的 DOM，从而渲染到页面中。 123456789101112131415161718192021222324<script> // render function // template -> render -> h -> 虚拟DOM（JS对象）-> 真实 DOM -> 展示到页面上 const app = Vue.createApp({ template: `<my-title :level="2">hello xiaokang </my-title>` }) app.component('my-title', { props: ['level'], render() { const { h } = Vue return h('h' ...
