Vue 是一个类似 Angular、React 的应用程序框架,但是更简单和轻便。Vue 1.0.25压缩过后的 JavaScript 代码小于80k。而 Angular 1.5.6 和 React 15.1.0 均相当于该尺寸的两倍以上。尽管其占用空间如此之小,Vue 非常强大且灵活。
Wijmo 同样也非常紧凑,强大而且灵活。这两个类库配合的天衣无缝。
Vue 和 Angular 有什么不同?
Vue.js 的目标是以尽可能简单的 API 提供反应式数据绑定以及可组合的视图组件。当您将 Vue 和 Angular 进行对比时,这些目标就变得非常清晰:
Vue 使用组件作为构建应用程序的基本构件。组件和 Angular 中的“元素指令(element directive)”非常相似。Vue 也有一些指令,这些指令和 Angular 的“属性指令(attribute directive)”很相似。这种清晰的区分使得创建和管理组件和指令更加简单。
Vue 的组件可以容易地进行组合,实际上,Vue 的应用程序可以被看做一个组件树。每一个组件具有其自己隔离开的范围,可以作为组件的常规属性直接访问。这一点和 Angular 1.x 有所不同,其中的组件和控制器在很大程度上是独立的。
Vue 通过属性 setter 侦测数据的改变。当侦测到数据变化时,Vue 会异步地触发 DOM 更新。不存在任何的 dirty 检查以及 digest 周期。这一点将大大的提升了性能,但是更重要的一点,这么做将逻辑大大简化。您不需要做任何特殊的操作以便在异步操作之后触发更新,比如说在一个 Ajax 调用或者某个 TimeOut 操作之后。
Vue 的 HTML 标记语法和 Angular 的非常相似,但是更加一致。在 Vue 中,常规属性(attrubite)始终表示字面值。之前有一个冒号的 attribute 属性则是“动态的”,或者说通过表达式计算出的值。双向的 attribute 属性具有一个“.sync”后缀。这一点和 Angular 1.x 中有所不同,按照指令作者的喜好,attribute 属性既可以是字面值,也有可能是表达式。
尽管存在这些差异,Vue 应用程序中所使用的标记语言仍然和 Angular 非常相似。
如何在 Vue 应用程序中使用 Wijmo?
为了在您的 Vue 应用程序中使用 Wijmo,首先需要添加到 Vue 和 Wijmo 的引用至您的页面,接下来需要包含 “wijmo.vue.js”模块,该模块定义了封装 Wijmo 控件的模块。例如:
<script src="https://npmcdn.com/vue@1.0.25/dist/vue.js"></script>
<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/Vue 互操作 --> <script src="scripts/wijmo.vue.js"></script>
<script src="scripts/app.js"></script>
现在您就可以在您的 Vue 应用程序中使用 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年,是全球最大的控件提供商,也是微软认证的金牌合作伙伴。