文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用Vue3.0，我收获了哪些知识点（一）

本文所有的示例均使用ant design vue2.0实现，关于ant design vue2.0请参考 https://2x.antdv.com/docs/vue/introduce-cn/ 初始化环境...vant, 本文所有示例代码都会基于ant-design-vue来进行，首先我们先安装ant-design-vue 安装依赖 yarn add ant-design-vue@2.0.0-beta.6 yarn...Vue3.0新体验之setup 对于Vue3.0的问世，最吸引大家注意力的便是Vue3.0的Composition API，对于Componsition API，可以说是两极分化特别严重，一部分人特别喜欢这个新的设计与开发方式...本节我们将主要为大家带来如何在Vue3.0中使用v-model,Vue3.0中的v-model提供了哪些惊喜以及如何在Vue3.0中自定义v-model。...本文首发于公众号【前端有的玩】，学习Vue,面试刷题，尽在【前端有的玩】，乘兴裸辞心甚爽，面试工作屡遭难。 幸得每日一题伴，点击关注莫偷懒。，下周一新文推送，不见不散。

61720
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    分享5个关于 Vue 的小知识，希望对你有所帮助（五）

    3、如何在某个元素上触发另一个元素的事件 我们可以通过给我们想要触发事件的元素分配一个 ref 来在 Vue.js 上触发事件。 然后我们可以调用分配给ref的元素上的方法来触发事件。...我们想要触发第二个按钮的点击事件。 为了做到这一点，我们添加了 myClickEvent 方法，该方法获取分配给 myBtn 引用的按钮。 然后我们对其进行调用。...在第二个按钮中，我们将 @click 指令设置为 myClickEvent2 以记录点击。 现在当我们点击第一个按钮时，我们会看到 'clicked' 已输出。...在本文中，我们将讨论如何在进行HTTP请求时传递自定义头部。 请查看下面的代码，了解如何在进行HTTP请求时向我们的API添加标头。...在使用键值对进行请求时，您可以添加任意数量的标头。

    16210

    vue-ant design示例大全——按钮本地cssjs资源

    vue-ant design示例大全——本地css/js资源 ---- 示例资源来自官网：https://www.antdv.com/components/button-cn 在 Ant Design...Vue 中我们提供了五种按钮。...虚线按钮：常用于添加操作。 文本按钮：用于最次级的行动点。 链接按钮：一般用于链接，即导航至某位置。 以及四种状态属性与上面配合使用。 危险：删除/移动/修改权限等危险操作，一般需要二次确认。... # 事件名称 说明 回调参数 版本 click 点击按钮时的回调 (event) => void 支持原生 button 的其他所有属性。...FAQ # 如何移除 2 个汉字之间的空格 # 根据 Ant Design 设计规范要求，我们会在按钮内(文本按钮和链接按钮除外)只有两个汉字时自动添加空格，如果你不需要这个特性，可以设置 ConfigProvider

    2.4K20

    Vue.js如何阻止子组件的点击事件？

    比方说我最近遇到一个问题，我需要在特定场景下，在父页面禁用子组件的点击事件，包括不限于子组件本身以及子组件内部子组件的点击事件。...下面我将使用 Ant Design Vue 框架实现一个示例，来展示如何在 Vue.js 中阻止子组件的点击事件。问题描述在表单业务中，有一个封装的子组件（包含 input 和 modal）。...方案二：在子组件外部覆盖一层透明遮罩在父组件中，通过动态显示透明遮罩来阻止点击事件。...总结在 Vue.js 中阻止子组件的点击事件有多种方式可供选择。通过在子组件中添加 prop 进行条件判断，可以明确传递状态控制子组件行为，但需要修改子组件代码，增加了耦合度。...在实际开发中，我们可以根据具体需求选择合适的方法来实现子组件的点击事件控制。希望这篇文章能为你在 Vue.js 开发中遇到类似问题时提供一些思路和帮助。

    50210

    如何从0开始搭建组件库

    比如一个四级地址的选择组件，在整个产品中应该就一种交互方式，如果一会是滚动选择，一会是点击选择，会让用户操作起来比较烦躁，统一交互可以减少用户学习成本。...1.element-plus - 经典中的经典，全面支持 Vue 3。 2.tdesign-vue-next - 鹅厂优质 UI 组件，配套工具完满，设计工整，文档清晰。...3.arco-design-vue- 字节跳动开源 UI 组件库，大厂逻辑，设计文档完美。 4.ant-design-vue - 蚂蚁前端 UI 库，面向企业级中后台。...添加新组件时，请按照下面的目录结构组织文件，并在 vant.config.js 中配置组件名称。...https://docs.npmjs.com/cli/publish 04 如何在项目中使用组件 理解，首先 MCube 会依据模板缓存状态判断是否需要网络获取最新模板，当获取到模板后进行模板加载

    68720

    企业级低代码平台Jeecgboot3.4.2及3.4.3版本新功能介绍

    3.4.2版本新功能：一、升级ant-design-vue到3.2.12版本、升级vite等前端依赖二、系统消息功能优化优化系统消息弹框风格当有新消息时，添加右上角消息通知，会弹出系统消息 图片支持弹出通知详情...点击“查看详情”即可弹出通知消息详情图片支持直接打开业务单据 当有流程通知或流程催办时可直接打开任务进行处理，图片支持标星 重要的消息，我们可以进行标星操作，标星后可能标星消息中查看 图片...支持查询图片三、菜单列表支持通过菜单名模糊查询图片四、快速定位方法点击右上角搜索可快速定位到路由菜单进行操作图片五、表单支持右侧嵌入评论区、附件区1....支持 js 增强首先自定义按钮，注意按钮编码图片添加js增强，js中方法名称必须与自定义按钮编码一致图片效果展示点击“js增强button”会打印所选中数据id图片5....优化简化 Online 对接积木报表使用体验开启后自动配置部分路径，只替换报表id即可图片列表添加打印按钮，点击打印即可打开积木报表图片7.

    1.2K20

    国产开源极致的微前端框架,成本低,速度快,原生隔离,功能强

    与市面上表单不一样的特点有： 1.一套表单三种模式一起设计 2.生成一套代码同时适应PC，ipad，手机端的预览。 3.支持在线编辑vue代码逻辑，不与可视化设计器生成的vue代码进行冲突。...6.属性，组件，事件，通用css都可以通过配置文件进行配置。...7.vue源码生成采用jquery+jquerytemplate模板生成，根据不同业务，框架生成不同风格，业务，框架的代码，如目前已有项目适应的表单有：element-ui表单，ant-ui表单，mini-ui...8.根据业务制定不同模板，生成不同的业务表单：如问卷调查表单，可视化大屏，流程表单，通用增删改查表单，只要业务存在一定的通用性，我们就可以创建一个不同的模板解析 9.支持很多快捷的方式，如点击事件，可切换源码...，编辑对应事件的方法。

    1.9K20

    加速 Vue 项目开发：使用低代码开发组件

    但想象一下，如果存在一种方式，可以让低代码无缝地融入我们的 Vue 项目，这将极大地加快 Vue 项目的开发速度。使用教程0. 安装依赖推荐使用 npm 命令安装依赖。...创建并使用组件目标： 创建一个(*.vue)组件，并在项目中使用。操作步骤：新建「PC云组件」；点击「出码 > Vue 3」到 components 或其他文件夹下。...为组件添加 props目标： 为组件添加 props，例如 。...为组件添加事件目标： 为组件添加事件，例如 。操作步骤：在「交互」面板中「添加输出项」，并修改输出项的 ID、标题、类型等。...如上图，把输出项的 ID 设置为「click」就完成了 @click 的事件声明。以上就是使用低代码开发组件的关键操作流程。

    26910

    Vue3 后台管理系统模板推荐

    数据库：采用MySql>5.7版本，数据库引擎 innoDB，使用 gorm 实现对数据库的基本操作，已添加对sqlite数据库的支持。...预览效果 vue-vben-admin (13.5k) Vue-Vben-Admin（github上的标星数为13.5k）是一个基于 Vue3.0、Vite、 Ant-Design-Vue、TypeScript...vue-admin-better（github上的标星数为7.2k 12.8k）主线版本基于 element-plus、element-ui、ant-design-vue 三者并行开发维护，同时支持电脑...免费商用，支持 PC、平板、手机） ⚡️ vue3.x + ant-design-vue（beta 版本，免费商用，支持 PC、平板、手机） ⚡️ vue3.x + vite + arco admin...-antd-admin (2k) vue3-antd-admin（github上的标星数为2k）基于vue-cli5.x/vite2.x + vue3.x + ant-design-vue3.x + typescript

    8.1K32

    如何用纯css打造类materialUI的按钮点击动画并封装成react组件

    前言 作为一个前端框架的重度使用者,在技术选型上也会非常注意其生态和完整性.笔者先后开发过基于vue,react,angular等框架的项目,碧如vue生态的elementUI, ant-design-vue...组件设计思路 仅仅用上述代码虽然可以实现一个按钮点击的动画效果,但是并不通用, 也不符合作为一个经验丰富的程序员的风格,所以接下来我们要一步步把它封装成一个通用的按钮组件,让它无所不用....组件的设计思路我这里参考ant-design的模式, 基于开闭原则,我们知道一个可扩展的按钮组件一般都具备如下特点: 允许用户修改按钮样式 对外暴露按钮事件方法 提供按钮主题和外形配置 可插拔,可组合.../index.less' /** * @param {onClick} func 对外暴露的点击事件 * @param {className} string 自定义类名 * @param {type...其实不仅仅是react, 我们使用同样的原理也可以实现一个vue版的按钮组件或者一个angular版的组件,变得只是语法而已.这样的组件设计思路和元素被官方用在很多ui库中, 比如单一职责原理, 组件的开闭原则

    1.9K30

    B端常用9大开源组件库集合（必备收藏）

    并且如WeX5前端开源框架等，也是基于Bootstrap的基础上而来的。从2011年Bootstrap发布后，在2018年，已经更新到了4。...可见，ArcoDesgin直接对标Ant Design，设计体系在中国不再只有Ant Design一家。...ArcoDesgin，林林总总有这些能力：ArcoDesgin基础组件库包含React和Vue两种语言；拥有设计价值观、设计原则、样式指南等设计层面上的理论来指导体系的建立；拥有对组件的详细使用解释和说明...就如我们公司整个是Vue生态，那么首选会是Element UI组件库。而一些React技术栈的公司，就会选择Ant Design。...同时，2021年推出的B端组件库，如ArcoDesgin、SemiDesgin、TDesgin，虽然其样式更美观，生态更健全，也未必会是产品研发团队的首选。

    2.3K20

    React 毁了 Web 开发！

    如何在JS框架中找到自己的方式 这与GitHub上的星星数量无关，你应该学习如今大多数 JS 框架都拥有的共同原则。了解其他框架的优缺点可以让你更好地了解自己选择的框架。...唐金州是开源组件库 Ant Design Vue 的作者，这一组件库已纳入 Ant Design 官方域名下，成为蚂蚁金服 Ant Design 官方唯一指定的 Vue 版组件库。...属性、事件、插槽、指令、修饰符......2017 年，开始开发基于 Ant Design 这一设计语言的 Vue 组件库，组件库开源后获得了众多好评，现已纳入 Ant Design 官方域名，成为了蚂蚁金服 Ant Design 官方唯一指定的...1.Vue 核心知识点及实现原理 从属性、事件、插槽、指令再到生命周期，让你学完后对 Vue 有一个全面的认识，可以上手开发基本的组件，甚至是负责项目中独立的模块。

    77630
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券