EEUI.APP EEUI.APP 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub - 起步 - 框架介绍 - 搭建环境 - 创建项目 - 配置相关 - 开发调试 - 上手 - 使用 Vue.js - 只含有运行时的构建版本 - 平台的差异 - 支持的功能 - 平台差异 - 环境变量 - 生命周期 - 跨页面通信 - appboard - 应用图标 - 启动图片 - 应用设置 - 升级程序 - 样式 - 通用样式 - 文本样式 - CSS 单位 - 颜色值 - 事件 - 通用事件 - 事件冒泡 - 手势
    # # 在 eeui 中使用 Vue.js - 只含有运行时的构建版本 - 平台的差异 - 执行环境 - DOM - 样式 - 事件 - 支持的功能 - 全局配置 - 全局 API - 选项 - 生命周期钩子 - 实例属性 - 实例方法 - 模板指令 - 特殊属性 - 内置组件

    如果没有特别指示,文章中的 "Vue.js" 或者 "Vue" 都指的是 v2 版本的 Vue。

    ## # 只含有运行时的构建版本 如果你熟悉 Vue.js,你应该知道 Vue.js 有两种构建版本: 运行时 + 编译器只包含运行时。它们之间的区别在于编译器是否需要能够在运行时编译 template 选项。由于运行时构建版本比完整版本的构建版本轻约 30%(Vue 官方估算),为了更好的性能和更小的代码体积,eeui 集成的是运行时版本的 Vue。 具体来说,差异如下: - 定义组件时不支持 template 选项。 - 不支持使用 x-templates 。 - 不支持使用 Vue.compile 。 ## # 平台的差异 Vue.js 最初是为 Web 平台设计的。虽然可以基于eeui开发原生应用程序,但是仍然存在许多eeui 与 Web 平台的差异。 与 Web 平台的主要差异是: 执行环境、DOM、样式和事件。 ### # 执行环境 eeui 主要用于编写多页的应用程序,每个页面都对应了原生开发中的 View 或者 Activity,并且保持自己的上下文。即使 eeui 的所有页面都使用的都是同一个 Javascript 引擎的实例(virtual machine),每个页面是执行环境也是互相隔离的(基于 Sandbox 技术)。 具体来讲,每个页面的 Vue 变量都是不同的实例,即使是写在 Vue 上的“全局”配置(Vue.config.xxx)也只会影响 eeui 上的单个页面。 ### # DOM 因为在 Android 和 iOS 上没有 DOM(Document Object Model),如果你要手动操作和生成 DOM 元素的话可能会遇到一些兼容性问题。在你使用现代前端框架的情况下,操作数据与组件而不是生成的元素是一个比较好的做法。 一些与 DOM 相关的特性,比如 v-htmlvm.$eltemplate 选项,在不同的平台上可能无法获得相同的反应。 准确来说,vm.$el属性类型在web环境下是HTMLElement,但是在移动端并没有这个类型。实际上,它是一个由 eeui 文档对象模型 定义的特殊数据结构。 ### # 样式 样式表和 CSS 规则是由 eeui js 框架和原生渲染引擎管理的。要实现完整的 CSS 对象模型(CSSOM:CSS Object Model)并支持所有的 CSS 规则是非常困难的,而且没有这个必要。 出现性能考虑,eeui 目前只支持单个类选择器,并且只支持 CSS 规则的子集。详情请参阅 通用样式文本样式。 在 eeui 里, 每一个 Vue 组件的样式都是 scoped。 ### # 事件 目前在 eeui 里不支持事件冒泡和捕获,因此 eeui 原生组件不支持事件修饰符,例如.prevent.capture.stop.self 。 此外,按键修饰符以及系统修饰键 例如 .enter.tab.ctrl.shift 在移动端基本没有意义,在 eeui 中也不支持。 ## # 支持的功能 ### # 全局配置

    Vue “全局”配置只会影响 eeui 上的单一页面,配置不会在不同的 eeui 页面之间共享。

    Vue 全局配置 是否支持 说明
    Vue.config.silent 支持 -
    Vue.config.optionMergeStrategies 支持 -
    Vue.config.devtools 不支持 -
    Vue.config.errorHandler 支持 -
    Vue.config.warnHandler 支持 -
    Vue.config.ignoredElements 支持 不推荐
    Vue.config.keyCodes 不支持 -
    Vue.config.performance 不支持 -
    Vue.config.productionTip 支持 -
    ### # 全局 API
    Vue 全局 API 是否支持 说明
    Vue.extend 支持 -
    Vue.nextTick 支持 -
    Vue.set 支持 -
    Vue.delete 支持 -
    Vue.directive 支持 -
    Vue.filter 支持 -
    Vue.component 支持 -
    Vue.use 支持 -
    Vue.mixin 支持 -
    Vue.version 支持 -
    Vue.compile 不支持 eeui 用的是 只包含运行时构建
    ### # 选项
    Vue 选项 是否支持 说明
    data 支持 -
    props 支持 -
    propsData 支持 -
    computed 支持 -
    methods 支持 -
    watch 支持 -
    el 支持 -
    template 不支持 eeui 用的是 只包含运行时构建
    render 支持 不推荐
    renderError 支持 -
    directives 支持 -
    filters 支持 -
    components 支持 -
    parent 支持 不推荐
    mixins 支持 -
    extends 支持 -
    provide/inject 支持 不推荐
    name 支持 -
    delimiters 支持 不推荐
    functional 支持 -
    model 支持 -
    inheritAttrs 支持 -
    comments 不支持 -
    ### # 生命周期钩子 Vue 组件的实例生命周期钩子将在特定的阶段发出,详情请参考 Vue 组件的生命周期图示
    Vue 生命周期钩子 是否支持 说明
    beforeCreate 支持 -
    created 支持 -
    beforeMount 支持 -
    mounted 支持 详见下文解释
    beforeUpdate 支持 -
    updated 支持 -
    activated 不支持 不支持
    deactivated 不支持 不支持
    beforeDestroy 支持 -
    destroyed 支持 -
    errorCaptured 支持 -
    TIP 具体详见生命周期篇。 ### # 实例属性
    Vue 实例属性 是否支持 说明
    vm.$data 支持 -
    vm.$props 支持 -
    vm.$el 支持 -
    vm.$options 支持 -
    vm.$parent 支持 -
    vm.$root 支持 -
    vm.$children 支持 -
    vm.$slots 支持 -
    vm.$scopedSlots 支持 -
    vm.$refs 支持 -
    vm.$isServer 支持 永远是false
    vm.$attrs 支持 -
    vm.$listeners 支持 -
    ### # 实例方法
    Vue 实例方法 是否支持 说明
    vm.$watch() 支持 -
    vm.$set() 支持 -
    vm.$delete() 支持 -
    vm.$on() 支持 -
    vm.$once() 支持 -
    vm.$off() 支持 -
    vm.$emit() 支持 -
    vm.$mount() 不支持 -
    vm.$forceUpdate() 支持 -
    vm.$nextTick() 支持 -
    vm.$destroy() 支持 -
    ### # 模板指令
    Vue 指令 是否支持 说明
    v-text 支持 -
    v-html 不支持 -
    v-show 不支持 不支持 display: none;
    v-if 支持 -
    v-else 支持 -
    v-else-if 支持 -
    v-for 支持 -
    v-on 支持 不支持事件修饰符
    v-bind 支持 -
    v-model 支持 -
    v-pre 支持 -
    v-cloak 不支持 只支持单类名选择器
    v-once 支持 -
    ### # 特殊属性
    Vue 特殊属性 是否支持 说明
    key 支持 -
    ref 支持 -
    slot 支持 -
    slot-scope 支持 -
    scope 支持 不推荐
    is 支持 -
    ### # 内置组件
    Vue 内置组件 是否支持 说明
    component 支持 -
    transition 不支持 在移动端 enterleave 的概念可能有点不同, 并且 eeui 不支持display: none;
    transition-group 不支持 transition 一样
    keep-alive 不支持 移动端的原生组件不能被前端缓存
    slot 支持 -
    在 GitHub 上编辑此页

    最后一次更新: 6/7/2019, 8:03:58 AM

    开发调试 平台差异