专业编程基础技术教程

网站首页 > 基础教程 正文

如何在ReactJS应用程序中使用Wijmo控件?

ccvgpt 2025-02-03 11:36:10 基础教程 7 ℃

什么是React？


React 是 Facebook 用来通过 JavaScript 构建用户界面的框架库。由于 React 是如此的独特并且如此地流行，因此我们无须在此花费一些时间来介绍其细节。

如何在ReactJS应用程序中使用Wijmo控件?

React 和 Angular 到底有什么不同？


React 不是一个完整的框架，而是一个“用做构建用户界面的 JavaScript 库”。这一点和 Angular 以及大多数典型的 JavaScript 框架有所不同。

它并没有在 HTML 标记语法中添加对自定义标签和属性的支持，而是构建并管理了一个虚拟的文档树，并在需要时将其和浏览器的实际 DOM 结构进行同步。该虚拟树通过 JavaScript 或者 JSX（一种JavaScript 语法扩展，使得 JavaScript 看起来像是 HTML）进行创建。

React 使用支持自我状态管理的组件。构建复杂的 UI 用户界面就是将这些组件进行组合。组件的逻辑通过 JavaScipt 进行编写（而不是使用模板），因此您可以保持在整个应用程序中对数据的访问。

React 的底层实现想法之一是使用其自有的数据结构保存一份 DOM 模型的复制。React 应用程序针对这份复制进行操作，而 React 将负责将发生的改变更新回实际的 DOM。这可以实现性能提升的结果，因为 React 会计算两份 DOM 之间的不同，并且在应用这些变化时非常的智能。

由于 React 创建了自己的 DOM 版本，使用其自有的组件，因此可以实现彻底的绕过浏览器并自己呈现文档。这是在 React Native 背后的理念，可以同它来创建 IOS 和安卓的原生应用程序。当然，如果您选择了该方向，您将无法使用 Wijmo 以及其他实际上依赖“真实” HTML 的类库。

如何在 React 应用程序中使用 Wijmo

为了在您的 React 应用程序中使用 Wijmo，首先要添加到 React 和 Wijmo 的引用到您的页面，接下来包含 “wijmo.react.js” 模块，该模块定义了封装 Wijmo 控件的 React 组件。例如：

<head>

<title>Wijmo 和 React</title>

<!-- React -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.js"></script>

<!--JSX/babel -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.16/browser.js"></script>

<!-- Wijmo -->

<link href="http://cdn.wijmo.com/5.latest/styles/wijmo.min.css" rel="stylesheet"/>

<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.min.js"></script>

<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.input.min.js"></script>

<script src="http://cdn.wijmo.com/5.latest/controls/wijmo.grid.min.js"></script>

<!--Wijmo/React 互操作 -->

<script src="scripts/wijmo.react.js"></script>

<!-- 应用程序脚本和样式 -->

<link href="styles/app.css" rel="stylesheet"/>

<script src="scripts/app.js"></script>

</head>

就是这么简单，现在您就可以在 React 应用程序中使用 Wijmo 组件了。还等什么，快来免费试用吧！

ComponentOne 产品线

Wijmo 是葡萄城 ComponentOne 产品线之一。ComponentOne 产品线包括 ComponentOne Studio（.Net控件集）、Wijmo（H5/JavaScript控件集）、Xuni（移动开发控件集）。作为跨设备跨平台的控件集，ComponentOne 产品线的3大产品，能满足. NET、Web、移动等各种平台的高效开发。

免费试用

请通过以下方式联系葡萄城，获取 Wijmo 的免费试用版：

微信：GrapeCityDT

邮件：marketing.xa@grapecity.com

官网：wijmo.gcpowertools.com.cn

关于葡萄城控件

葡萄城是一家跨国软件研发集团，专注控件领域近30年，是全球最大的控件提供商，也是微软认证的金牌合作伙伴。

Tags：

猜你喜欢

最近发表
标签列表