组件 组件基础 <my-counter></my-counter> const app = Vue.createApp({ // 根组件 data() { return {} } }) //注册子组件my-counter app.component('my-counter', { data() { return {} }, template: ``, methods: { } }).mount('dom节点') 通过props向子组件传值 <blog-post title='…

前言 最近在b站上学习了飞哥的vue教程 学习案例已上传,下载地址 class绑定 对象绑定 :class='{active:isActive}' // 相当于class="active" :class="'active'" // 相当于class="active" ,这里绑定的是一个字符串 :class='classObject' // 配合计算属性使用,绑定一个函数 Vue.createApp({ data(){ return { isAct…

前言 最近在b站上学习了飞哥的vue教程 学习案例已上传,下载地址 指令 #id2{ // css部分 font-size: 24px; color: green; } v-bind:href="myUrl" v-bind:id="myId" // 等同于:href="www.baidu.com" id="id2" v-on:blur="myBlur" Vue.createApp({ data(){ ret…

前言 最近在b站上学习了飞哥的vue教程 学习案例已上传,下载地址 使用方式 使用在线cdn 下载js文件并自托管,引入到项目后使用 使用npm安装后,用cli来构建项目 声明式渲染 Vue2需引入vue.min.js {{msg}} // Mustache 语法 var vm = new Vue({ // 实例化vue,在实例中渲染 data: { msg: '文本' } }) Vue3不需要实例化vue,需引入vue.global.js (在 unpkg 和 jsDelivr 上获取) {{…

使用vite构建项目步骤 安装node,cmd输入:node -v验证是否安装成功:一般node安装后会自动安装npm,cmd输入:npm -v验证是否安装成功 选择一个文件夹作为项目文件夹,搜索框输入cmd,输入:npm init @vitejs/app 输入项目名称或者按enter使用默认名称:vite-project 选择框架vue 进入项目:cd vite-project 执行:npm install 运行项目:npm run dev 如果出现报错,管理vue模板校验:VSCode ->…

基于Vue3.0构建PC桌面端自定义美化滚动条组件V3Scroll. 前段时间有分享一个Vue3 PC网页端弹窗组件,今天带来最新开发的Vue3.0版虚拟滚动条组件. V3Scroll 使用vue3.x开发的轻量级自定义美化滚动条组件.功能效果基本和之前的vue2版保持一致.支持是否自动隐藏滚动条.自定义滚动条尺寸.颜色及层级等功能. 功能效果类似饿了么el-scrollbar组件.并且支持监听DOM尺寸改变,动态更新滚动条. ◆ 快速引入 在main.js中全局引入滚动条v3scroll组件.…

在大多数情况下,你都可以操作数据来修改视图,或者反之.但是还是避免不了偶尔要操作原生 DOM,这时候,你就能用到自定义指令. 举个例子,你想让页面的文本框自动聚焦,在没有学习自定义指令的时候,我们可能会这么做. const app = Vue.createApp({ mounted(){ this.$refs.input.focus(); }, template: `<input type="text" ref="input" />`, }); 在mou…

vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支. ========================== 问答 1.vue 组件有什么? 为什么要加上 vue,因为不同的 MVC 框架,东西不一样,不过基本的功能都有. 组件有 data.computed.watch.methods 以及生命周期钩子等.对于入门…

vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 尽量把纷繁的知识,肢解重组成为可以堆砌的知识. 我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支. ========================== 什么是数据流 拿烽火戏诸侯的典故来理解:典故里的数据是什么?战乱.如何传递数据?用烽火.尽管这个典故传递的是假数据,但它确实传递了数据.在这个典故里,数据只能…

vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支. ========================== 定义一个基础组件 这个基础组件,是导航条中 可以复用 的基础组件 单个导航. 基础组件[导航组件]基础的功能是能够显示文字,单击的交互方式.明确任务目标之后,进行开发. 在 component 目录下新建…