在 Laravel 中一起使用 React.js 和 Vue.js

2024-01-04

我真的很想知道,是否可以在 Laravel 中同时使用 React.js 和 vue.js?
例如,使用 ReactJs 作为管理仪表板,使用 VueJs 作为客户端仪表板。我知道使用其中之一在技术上和逻辑上更好。
你怎么认为?我们可以一起使用它们吗?


是的。这绝对是可能的。多语言编程已成为当今的现实。您可以采取几种方法。最常见的方法是微前端 https://micro-frontends.org/.

如何实现微前端取决于您!但一般来说,您将在两条不同的路线上获得两种不同的 SPA 服务。您将使用超链接/锚标记互连这两个应用程序。但是,请注意,做一些事情需要很大的成本,并且对于非常大的应用程序和构建它们的团队来说确实意味着。

有许多叶组件,例如按钮、链接、下拉菜单等,您最终将为这两个框架开发和维护它们。每个框架的状态管理、路由、服务都将被重写。跨框架匹配一致的风格指南是非常痛苦的。

如今,如果您确实需要继续使用这种方法,您可以考虑为叶组件使用自定义元素。它们应该适用于许多 SPA 框架(请参阅注释)。这将帮助您省去重新发明轮子的麻烦。

注意:React 对 Web 组件不太友好。它在很多方面都失败了高级测试 https://custom-elements-everywhere.com/.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Laravel 中一起使用 React.js 和 Vue.js 的相关文章

  • 如何在每个测试中更改笑话模拟函数的返回值?

    我的组件测试文件中有一个像这样的模拟模块 jest mock magic index gt navigationEnabled gt true guidanceEnabled gt true 这些函数将在我的组件的渲染函数中调用 以隐藏和显
  • “ReactNode”不是有效的 JSX 元素

    我有以下代码 代码沙箱 https codesandbox io s react typescript forked 50beyp file src App tsx import ComponentType ReactNode from r
  • 场次抽奖

    有人能解释一下什么是会话扫彩票吗 我已附加 Laravel 框架的默认会话配置文件 问题 1 它说某些会话驱动程序必须manually扫荡他们的 存储位置 有人可以描述这个过程以及为什么会这样吗 必要的 哪些会话驱动程序需要此操作 2 为什
  • 获取React组件的类型propTypes定义

    假设有以下代码 TestComponent propTypes text React PropTypes string myEnum React PropTypes oneOf News Photos 我在另一个文件中执行了以下操作 使用
  • 将 redux 数据保存为 state 中的对象数组,如果 state 有先前的状态可用,则更新状态

    我收到的回复如下格式示例 const response data name abc age 10 id 10 name def age 15 id 20 name abc 我想将其保存在我的 redux 状态中 如果 response na
  • 重置密码 电子邮件

    我是 Laravel 开发新手 目前正在从事小型项目 我想自定义重置密码的电子邮件模板 甚至将其链接到完全不同的模板 对于身份验证脚手架 我使用了php artisan make auth命令 但是 默认重置密码功能使用默认的 Larave
  • React Map 总是使用最后一个元素的数据调用方法

    我正在制作一个社交媒体应用程序 我正在循环浏览所有评论并将其显示在用户界面上 当我单击编辑时 最后一条评论的文本总是显示在输入中 我尝试了很多不同的方法 改变了结构 使用bind来绑定上下文 但没有任何帮助 我正在使用 React Mate
  • 处理 Redux 和 React 中错误的最佳实践

    我的 redux 操作中有一个异步函数 它在我的减速器中返回一个像这样的对象 user fetching false fetched false error null 所以基本上当我开始调用异步函数时我将 redux 状态更新为fetchi
  • Laravel 在 Eloquent 范围和查询中使用 select

    我正在尝试清理我编写的一些代码 这是当前的代码 message Message with comments gt join users messages created by users id gt join team user messa
  • 具有两组子组件的 React 组件

    我正在创建一个组件 需要接收两组子组件并放置在组件的两个不同部分中 let CreditCardForm icons fields gt div div div div icons div div div fields div let Cr
  • 如何在 Laravel 查询中使用多个 OR,AND 条件

    我需要 Laravel 查询帮助 我的自定义查询 返回正确结果 Select FROM events WHERE status 0 AND type public or type private 如何写这个查询Laravel Event w
  • 提及列表和表情符号顶部位置 (Draft.js)

    您能帮我如何将其位置从下到上更改吗 我想在文本顶部而不是底部显示提及列表 关于表情符号列表的同样问题 示例链接 https www draft js plugins com plugin emoji 你可以通过以下方式实现它position
  • FullCalendar-vue + Typescript:属性“getApi”不存在

    我尝试将 FullCalendar vue 与 Typescript 结合使用 但在访问其 API 时遇到错误 我的日历设置如下
  • 限制自己超载外部 API 的速率

    我发现了很多信息和脚本示例 展示了如何对 API 用户进行速率限制 但我无法找到任何示例来说明在施加这些限制时如何对您自己的 API 请求进行速率限制 我总是用诸如以下的代码来限制我的脚本sleep or usleep命令 但感觉这是一种低
  • VueJS 中数据无法正确显示

    我的 VueJS 代码有一个小问题 在 输出 压缩的 GS1 数字链接 URI 部分中 When there is no result it should have nothing display like this I have remo
  • 想要动态处理与分页相关的页码显示:ReactJS

    我有一些分页逻辑工作得很好 唯一的问题是我只能让它显示并固定数量的页面可供选择 现在我已经把它放到了 5 页 但我希望它能够根据总记录动态更改 假设我有 100 条记录 每页限制为 10 条 将有 10 页 现在我只能让它以这种方式显示 第
  • Laravel,从 JSON 中删除 null Eloquent 对象属性

    有没有一种优雅的方法从 Eloquent 对象中删除 NULL 值 我的对象嵌套有关系 这个特定的调用可能会长达数千行 所以我尝试这样做的主要原因是为用户节省带宽 但服务器性能也是一个考虑因素 My code data locations
  • React 中的 Reconciliation 详解

    我是 React JS 的新手 谁能准确解释和解是如何运作的 我尝试从 React 官方网站上理解它 但没有得到它 我是这样理解的 您会同意 React 使用组件使事情变得简单且更快 通过 JSX 我们可以让用户定义的组件变得更容易 一天结
  • React autoFocus 将光标设置为输入值的开头

    我有一个受控输入 最初显示一个值 我已将该输入设置为自动聚焦 但当我希望它出现在末尾时 光标出现在输入的开头 我知道这可能是因为自动对焦是在值之前添加的 但我不能 100 确定 在输入字段末尾完成光标初始化的最佳方法是什么 var Test
  • 保存多对多关系,同步/附加不存在?

    我有以下两个多对多关系的模型 use Illuminate Database Eloquent Model class Permission extends Model The database table used by the mode

随机推荐

  • jQuery 文件上传不显示预览

    The jQuery 文件上传 http blueimp github com jQuery File Upload 插件当前不显示所选文件 有谁知道我该如何解决这个问题 我已经实现了 自定义 模板 见下文 注意我不需要显示以前上传的材料
  • 将 OAuth2AuthorizedClient 解析为 Spring bean

    我有一个自动连接许多服务的控制器 这些服务是 HTTP Restful 调用 从各种数据源检索数据 但这些服务受 OAuth2 0 保护 我正在尝试使用 Spring Security 来实现客户端凭据流 该流将允许这些服务安全地从这些受保
  • CSS3 过渡事件

    元素是否会触发任何事件来检查 css3 转换是否已开始或结束 W3C CSS 过渡草案 https www w3 org TR css3 transitions transition events CSS Transition 的完成会生成
  • 我的 SQL 出了什么问题? (查找“上一条”记录)

    我的 SQL 查询应该返回以前的记录 声明 Previous 意味着它具有不同的主键 idData 相同的 SSN Number 和较早的 Received Date 问题是 Received Date 可能相等 所以我必须寻找另一列 优先
  • SQL Server 中 INET_ATON 的等价物是什么

    正如问题所说 SQL Server 相当于什么INET ATON来自 mysql 我需要这个的原因是因为我从以下位置导入了 IP 数据库http ipinfodb com ip database php http ipinfodb com
  • 对静态变量 C++ 的未定义引用

    您好 我在以下代码中收到未定义的引用错误 class Helloworld public static int x void foo void Helloworld foo Helloworld x 10 我不想要一个static foo
  • Silverlight ClientHttp Web请求超时

    我有一个 silverlight 4 应用程序 使用 ClientHttp 堆栈来创建一个提供二进制流服务的 WebRequest 然后我从这个流中读取并做一些事情 但是 我有以下问题 服务器缓冲了它发送下来的数据 因此发送过程就像发送 暂
  • c#:如何从 List 中的特定索引读取

    我有一类人员和列表集合 因为列表包含人员类的所有值 例如 列表 ilist 有 2 个值 0 firstname lastname 1 名字2 姓氏2 现在 当我迭代列表时 我可以打印列表 但我想更改列表中某些部分的值 例如在索引 1 中
  • JSF 语言切换器和 ajax 更新

    这个问题是老问题的后续JSF 2 中的语言切换器实现 https stackoverflow com questions 10204001 language switcher implementation in jsf 尽管 PrimeFa
  • jqplot - 轴标签中的上标

    正如标题所说 如何将上标字体添加到 jqplot 图表中的轴标签 我尝试使用 Javascriptsup 函数以及轴标题的实际 html 标签 但没有成功 Basically I need to display units like m3
  • 如何清除 HTML5 画布中的圆弧或圆?

    我发现有一个clearRect 方法 但找不到任何可以清除圆弧 或整圆 的方法 有什么办法可以清除画布上的弧线吗 没有clearArc但是你可以使用复合操作来实现同样的事情 context globalCompositeOperation
  • 如何使用php将base64字符串转换为二进制数组

    我有一个 Base 64 编码的字符串 看起来像这样 cuVrcYvlqYze3OZ8Y5tSqQY205mcquu0GsHkgXe4bPg 我尝试过base64 decode 输出是 r kq c R 6 w l 我想我可能做错了什么 我
  • 在Python中找到公差范围内两个矩阵的交集?

    我正在寻找找到两个不同大小矩阵的交集的最有效方法 每个矩阵具有三个变量 列 和不同数量的观测值 行 例如矩阵A a np matrix 1 5 1003 2 4 1002 4 3 1008 8 1 2005 b np matrix 7 9
  • 如何在亚马逊网络服务中从 boto3 生成 url

    我在 s3 中有一个 Bucket 我正在尝试提取其中图像的 url 我正在使用 boto3 并且 boto3 似乎没有实现生成 url 方法 他们有一个核心方法 可以生成这样的 url import botocore session se
  • 如何在数据库中存储税金?

    我需要在我的项目中添加每个省 州的税费 我正在争论是否应该在省份和税收之间添加多对多关系 或者只是向每个省份添加tax1 name tax1 rate tax2 name tax2 rate 我不认为任何地方都有超过2个税吗 我还需要存储每
  • aurelia-fetch-client 动态创建请求标头

    我正在使用 aurelia fetch client 将一些数据发送到 web api 在注册方法中 headers Headers register this headers new Headers this headers append
  • Composer 安装“无法打开流”

    每当我运行安装程序 甚至手动安装 Composer 时 我都会收到一条错误 不允许我完成安装 这很烦人 在 Laragon 中 一个程序用于使用 Composer 及其包创建许多不同的项目 它不允许我使用 Laravel 因为 Compos
  • .NET Core 实体框架存储过程

    我正在尝试将 ASP NET 4 5 应用程序移植到 NET Core 但有一个我似乎无法解决的实际问题 我现有的应用程序执行存储过程 该存储过程返回具有多个数据表的数据集 实体框架可以自动将返回的字段映射到我的实体属性 但仅适用于数据集中
  • 为什么 Chrome 开发者工具会自动阻止请求?

    我正在尝试构建一个 PWA 渐进式 Web 应用程序 但 Chrome 开发工具控制台警告说它正在阻止我的 css 和图标文件 Request was blocked by DevTools https example com styles
  • 在 Laravel 中一起使用 React.js 和 Vue.js

    我真的很想知道 是否可以在 Laravel 中同时使用 React js 和 vue js 例如 使用 ReactJs 作为管理仪表板 使用 VueJs 作为客户端仪表板 我知道使用其中之一在技术上和逻辑上更好 你怎么认为 我们可以一起使用