OpenTiny Vue 组件库支持 Vue2.7 啦!

news2024/11/27 6:25:44

之前 OpenTiny 发布了一篇 Vue2 升级 Vue3 的文章。

🖖少年,该升级 Vue3 了!

里面提到使用了 ElementUI 的 Vue2 项目,可以通过 TinyVue 和 gogocode 快速升级到 Vue3 项目。

有朋友评论替换button出错了,并且贴出了报错截图。

vue2.7替换button出错.png

出现这个报错的原因是 TinyVue 组件库当时还不支持 Vue2.7 版本,Vue2.7 是升级 Vue3 的一个过渡版本,支持了 Composition API 写法,相较于 Vue2.6 差异较大。

这个问题早在今年4月份就有社区的朋友 lipan007 提交过 issue:

github.com/opentiny/ti…

这个问题终于将在 TinyVue 的 v2.11.0 版本终结!

目前 v2.11.0 版本已经发布了 alpha 版本,欢迎朋友们体验和使用!

npm i @opentiny/vue@2.11.0-alpha.2

现在带着大家体验下这个版本。

在 Vue2.7 项目中使用 2.10.0 版本的 TinyVue

先用 Vue CLI 创建一个 Vue2 项目

vue create vue2-demo

安装 @opentiny/vue@2 组件库

npm i @opentiny/vue@2

然后把 Vue 和 TinyVue 版本显示出来。

vue2.7+tiny-vue2.10.png

可以看到 Vue 2.7.14 和 TinyVue 2.10.0 的组合,项目是跑不起来的,控制台报错。

[Vue warn]: inject() can only be used inside setup() or functional components.

found in

---> <Anonymous>
       <TinyButton>
         <App> at src/App.vue
           <Root>

以前:

不好意思,TinyVue 目前只支持 Vue2.6 和 Vue3+ 版本,还不支持 Vue2.7,你需要把 package.json 文件中的 vue 和 vue-template-compiler 两个包前面的 ^ 去掉,删除 package-lock.json 文件,然后重新执行下 npm i 安装下依赖。

现在:

升级下你的 TinyVue 到 2.11.0 版本就行了。

升级到 2.11.0 版本

执行以下命令,升级 TinyVue 版本。

npm i @opentiny/vue@2.11.0-alpha.2

tiny-vue2.11.0.png

升级完之后,button 按钮显示正常!

欢迎朋友们体验和使用 2.11.0 版本,如果你在使用过程中有任何问题,欢迎提交 issue 或者加小助手进行反馈:opentiny-official。

关于 OpenTiny

OpenTiny 是一套企业级 Web 前端开发解决方案,提供跨端、跨框架的UI组件库,适配 PC 端 / 移动端等多端,支持 Vue2 / Vue3 / Angular 多技术栈,拥有灵活扩展的低代码引擎,包含主题配置系统 / 中后台模板 / CLI 命令行等丰富的效率提升工具,可帮助开发者高效开发 Web 应用。

欢迎加入 OpenTiny 开源社区。添加微信小助手:opentiny-official 一起参与交流前端技术~

OpenTiny 官网:opentiny.design/

OpenTiny 代码仓库:github.com/opentiny/

TinyVue 源码:github.com/opentiny/ti…

TinyEngine 源码: github.com/opentiny/ti…

欢迎进入代码仓库 Star🌟TinyEngine、TinyVue、TinyNG、TinyCLI~

如果你也想要共建,可以进入代码仓库,找到 good first issue标签,一起参与开源贡献~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1188459.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

K8S篇之etcd数据备份与恢复

一、etcd备份与恢复 基本了解&#xff1a; 1、k8s 使用etcd数据库实时存储集群中的数据&#xff0c;安全起见&#xff0c;一定要备份。 2、备份只需要在一个节点上备份就可以了&#xff0c;每个节点上的数据是同步的&#xff1b;但是数据恢复是需要在每个节点上进行。 3、etcd…

性能测试从0到1

性能测试概念 我们经常看到的性能测试概念&#xff0c;有人或称之为性能策略&#xff0c;或称之为性能方法&#xff0c;或称之为性能场景分类&#xff0c;大概可以看到性能测试、负载测试、压力测试、强度测试等一堆专有名词的解释。 针对这些概念&#xff0c;我不知道你看到…

AppWeb 身份验证绕过漏洞 (CVE-2018-8715)漏洞复现

漏洞描述 AppWeb 是一个嵌入式 Web 服务器&#xff0c;基于由 Embedthis Software LLC 开发和维护的开源 GPL 协议。它是用C / C编写的&#xff0c;几乎可以在任何现代操作系统上运行。当然&#xff0c;它旨在为嵌入式设备提供一个 Web 应用程序容器。 AppWeb 可以配置为身份…

lua 时间差功能概略

简介 在进行程序设计过程中&#xff0c;经常需要对某些函数、某些程序片断从开始运行到运行结束所耗费的时间进行一些量化。这种量化实际上就是计算时间差。 获取函数耗时情景如下&#xff1a; function time_used() --开始计时-- do something at here. --结束计时--时间差&…

kubernetes集群编排——k8s资源监控

资源限制 上传镜像 [rootk8s2 limit]# vim limit.yaml apiVersion: v1 kind: Pod metadata:name: memory-demo spec:containers:- name: memory-demoimage: stressargs:- --vm- "1"- --vm-bytes- 200Mresources:requests:memory: 50Milimits:memory: 100Mi [rootk8s2…

Kotlin系列之注解详解

目录 注解&#xff1a;file:JvmName 注解&#xff1a;JvmField 注解&#xff1a;JvmOverloads 注解&#xff1a;JvmStatic 注解&#xff1a;JvmMultifileClass 注解&#xff1a;JvmSynthetic 注解&#xff1a;file:JvmName file:JvmName(“XXX”) 放在类的最顶层&#x…

基于51单片机蓝牙智能控制风扇-proteus仿真-源程序

基于51单片机蓝牙智能控制风扇-proteus仿真-源程序 一、系统方案 1、本设计采用51单片机作为主控器。 2、DS18B20采集温度值送到液晶1602显示。 3、按键设置上下限&#xff0c;自动模式&#xff0c;低于下限&#xff0c;风扇不启动&#xff0c;下限到上限之间&#xff0c;风扇1…

开源知识库软件xwiki在Windows下的安装

文章目录 开源知识库软件-xwiki在windows上的部署0、参考文档1、前置环境准备1.1、Windows版本及系统配置1.2、JDK11安装1.3、Tomcat9安装1.4、MySQL5.7数据库的安装 2、xwiki安装3、配置3.1、修改配置支持对文档内容进行搜索 4、问题解决4.1、附件无法上传问题4.1、附件无法下…

快速搭建开源分布式任务调度系统DolphinScheduler并远程访问

使用Docker部署开源分布式任务调度系统DolphinScheduler 文章目录 使用Docker部署开源分布式任务调度系统DolphinScheduler前言1. 安装部署DolphinScheduler1.1 启动服务 2. 登录DolphinScheduler界面3. 安装内网穿透工具4. 配置Dolphin Scheduler公网地址5. 固定DolphinSchedu…

如何选择一个向量数据库|Qdrant Cloud v.s. Zilliz Cloud

随着向量数据库的热度不断攀升&#xff0c;越来越多人开始关注到这一赛道&#xff0c;传统数据库和检索系统也在快速集成专门的向量检索插件方面展开角逐。Qdrant 因其易用性和用户友好的开发者文档&#xff0c;面世不久即获得关注。 Qdrant 以 Rust 语言构建&#xff0c;提供 …

如何在OpenWRT上安装SFTP并实现公网远程文件传输

文章目录 前言 1. openssh-sftp-server 安装2. 安装cpolar工具3.配置SFTP远程访问4.固定远程连接地址 前言 本次教程我们将在OpenWRT上安装SFTP服务&#xff0c;并结合cpolar内网穿透&#xff0c;创建安全隧道映射22端口&#xff0c;实现在公网环境下远程OpenWRT SFTP&#xf…

基于FPGA的图像RGB转HSV实现,包含testbench和MATLAB辅助验证程序

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 4.1. RGB与HSV色彩空间 4.2. RGB到HSV转换原理 5.算法完整程序工程 1.算法运行效果图预览 将FPGA的仿真结果导入到matlab中&#xff1a; 2.算法运行软件版本 vivado2019.2 matlab2022a …

Leetcode-394 字符串解码(不会,复习)

此题不会&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; 题解思路&#xff1a;元组思想&#xff1a;数字[字符串]&#xff0c;每次遇到中括号意味着要重复数字次字符串…

conda清华源安装cuda12.1的pytorch

使用pytorch官方提供的conda command奇慢无比&#xff0c;根本装不下来&#xff08;科学的情况下也这样&#xff09; 配置一下清华源使用清华源装就好了 清华源&#xff1a;https://mirrors.tuna.tsinghua.edu.cn/anaconda/cloud/pytorch/ 配置方法&#xff1a;conda config --…

OpenAI 工程师平均薪酬 92.5 万美元;SpaceX 明年将每两天发射一次丨 RTE 开发者日报 Vol.81

开发者朋友们大家好&#xff1a; 这里是 「RTE 开发者日报」 &#xff0c;每天和大家一起看新闻、聊八卦。我们的社区编辑团队会整理分享 RTE &#xff08;Real Time Engagement&#xff09; 领域内「有话题的 新闻 」、「有态度的 观点 」、「有意思的 数据 」、「有思考的 文…

【Git企业开发】第六节.配置 Git和标签管理

文章目录 前言一、配置 Git 1.1 忽略特殊文件 1.2 给命令配置别名二、标签管理 2.1 理解标签 2.2 创建标签 2.3 操作标签 总结 前言 一、配置 Git 1.1 忽略特殊文件 在日常开发中&#xff0c;我们有些文件不想或者不应该提交到远端&#xff0c;…

HGHAC4.2.1开启DCS Failsafe Mode的步骤

瀚高数据库 目录 环境 文档用途 详细信息 环境 系统平台&#xff1a;Linux x86-64 Red Hat Enterprise Linux 7 版本&#xff1a;4.5.8 文档用途 本文档用于介绍hghac4.2.1版本开启dcs failsafe mode的步骤及验证方法 详细信息 一、新增功能说明 Hghac4.2.1封装自patroni3.…

嵌入式养成计划-51----ARM--ARM汇编指令--内存读写指令--程序状态寄存器传输指令--软中断指令--混合编程

一百二十七、内存读写指令 通过内存读写指令可以实现向内存中写入指定数据或者读取指定内存地址的数据 127.1 单寄存器内存读写指令 将一个寄存器中的数值写入到内存&#xff0c;或者从内存中读取数据放在某一个指定寄存器中 127.1.1 指令码和功能 1. 向内存中写&#xff…

求极限问题:x趋于0时的等价替换及其适用条件、洛必达法

x趋于0时的等价替换及其适用条件 等价无穷小的定义&#xff1a; 若 lim ⁡ β α 1 \lim\dfrac{\beta}{\alpha}1 limαβ​1&#xff0c;则 β \beta β 与 α \alpha α 是等价无穷下的&#xff0c;记作 α ∼ β \alpha \sim \beta α∼β. 即当两个函数相比取极限&…

数据结构与算法(Java版) | 万字详解算法的时间复杂度

下面我们用一个问题来引出算法的时间复杂度这一概念。 该问题是&#xff0c;怎么去衡量一个程序&#xff08;或者算法&#xff09;的执行时间呢&#xff1f;就拿我们刚刚讲的排序算法来说&#xff0c;排序算法这么多&#xff0c;你又如何知晓哪一个排序算法执行的时间谁长谁短…