zul组件、zhtml组件、native组件的区别

一，所属命名空间不同

zul组件 xmls= http://www.zkoss.org/2005/zul

zhtml组件 xmlns:h=" http://www.w3.org/1999/xhtml "

native组件 xmlns:n=" http://www.zkoss.org/2005/zk/native "

二，组件类不同

zul组件 zul.jar下组件类

zhtml组件 zhtml.jar下组件类

native组件全部是zk.jar下的类org.zkoss.zk.ui.HtmlNativeComponent

三，事件处理EventHandler

1，zhtml组件可以触发事件处理函数onSetting

<h:input value="测试" type="button" forward="onSetting" xmlns:h=" http://www.w3.org/1999/xhtml"/ >

2， native组件不可以触发事件处理函数onSetting

<n:input value="测试" type="button" forward="onSetting" xmlns:n="native"/>

3，zul组件可以触发事件处理函数onSetting

四，受管状态

所谓受管状态，全由个人杜撰，即所在命名空间保存其组件信息，可通过命名空间查找删除组件

1）结论

1，zul组件与 zhtml组件是受所在命名空间管理的
2，native组件不受所在命名空间管理

2）结论依据

zul组件、zhtml组件、native组件有一个共同祖先 org.zkoss.zk.ui.AbstractComponent类
在zk5.06版中的AbstractComponent类的setId(543行)方法中有一行代码
addToIdSpaces(this);（589行），意思是将当前组件添加到id命名空间中,
例如添加到window,page中，但在addToIdSpaces方法中有一段有趣的代码

 /** Adds to the ID spaces, if any, when ID is changed.* Caller has to make sure the uniqueness (and not auto id).*/private static void addToIdSpaces(final Component comp) {final String compId = comp.getId();if (comp instanceof NonFellow || isAutoId(compId))return; //nothing to doif (comp instanceof IdSpace)((AbstractComponent)comp).bindToIdSpace(comp);addFellow(comp, getSpaceOwnerOfParent(comp));}

这段有趣的代码

if (comp instanceof NonFellow || isAutoId(compId))return; //nothing to do

意思是排除符合NonFellow接口的组件，排除由zk自动生成id的组件
然后我查看了zul组件，zhtml组件，native组件，发现native组件HtmlNativeComponent实现了该接口
如下：

public class HtmlNativeComponent extends AbstractComponent implements DynamicTag, Native {//................}public interface Native extends NonFellow {//................}

五，生成静态内容

zul页面代码

<?xml version="1.0" encoding="utf-8"?>
<windowxmlns:w="client" xmlns:n="native" xmlns="http://www.zkoss.org/2005/zul"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul/zul.xsd"apply="IndexController"><h:input  value="测试" type="button" forward="onSetting" xmlns:h="http://www.w3.org/1999/xhtml"/><n:input  value="测试" type="button" forward="onSetting" xmlns:n="native"/><button mold="os" label="测试"   forward="onSetting"></button>
</window>

生成静态内容，与上面代码顺序一样

['zhtml.Widget','oW6Q1',{$onClick:true,prolog:'<input id="oW6Q1" value="测试" type="button"/>'},[]],

['zk.Native','oW6Q2',{prolog:'\n\t<input value="测试" type="button"/>'},[]],

['zul.wgt.Button','oW6Q3',{$onClick:true,prolog:'\n\t',label:'测试'},[],'os']]]]]);

从中我们可以看出：

1，从上面json格式的代码可以看出zhtml与native组件仅仅做了简单的处理，直接输出到prolog属性上

2，zul组件与zhtml组件都监听了onClick事件，$onClick:true，从而触发服务器端controller类的事件处理程序

实践：

由上可以知道，native组件无法getFellow得到，所以如果你这么做了，一定获得null，

但如果想获得native组件，有一个方法：

获得native组件附近的受管zhtml组件或zul组件然后通过这些组件的方法获得

1，如果父组件是native组件，getParent方法

2，如果子组件第一个组件是native组件 getFirstChild方法
,

3，如果子组件的第一个组件是native组件getLastChild方法，

4，如果相邻的上一个组件是native组件，getNextSibling方法

5，如果相邻的上一个组件是native组件，getPreviousSibling方法

6，当然你也可以使用链式方法获取native组件

zul组件、zhtml组件、native组件的区别相关推荐

React Native组件的结构和生命周期
React Native组件的结构和生命周期一.组件的结构 1.导入引用可以理解为C++编程中的头文件. 导入引用包括导入react native定义的组件.API,以及自定义的组件. 1.1 导 ...
微信小程序____小程序的组件用法与HTML5标签的区别
熟悉一门开发语言或是一种框架,除了了解它的基本语法.基本控件.基本属性之外,最好的方式莫过于追根溯源,与同类型的.自己熟悉的语言比较并了解它的异同,这样才能更好的去理解并记忆. 下面我们先探究下它们之 ...
vue教程2 【Vue组件化编程】组件的创建和使用非单文件组件和单文件组件的区别
组件实现局部功能的代码和资源的集合非单文件组件 1.定义组件(创建组件) 2.注册组件 3.使用组件(写组件标签) 定义使用Vue.extend(options)创建,其中options和new ...
在Flutter中嵌入Native组件的正确姿势
引言在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...
React创建组件的三种方式及其区别
React推出后,出于不同的原因先后出现三种定义react组件的方式,殊途同归:具体的三种方式: 函数式定义的无状态组件 es5原生方式React.createClass定义的组件 es6形式的ext ...
React Native组件开发指南
React Native的组件开发一直处在一个比较尴尬的处境.在官方未给予相关示例与脚手架的情况下,社区中依然诞生了许许多多的React Native组件.因为缺少示例与规范,很多组件库仅含有一个in ...
netcore实践：跨平台动态加载native组件
缘起netcore框架下实现基于zmq的应用.在.net framework时代,我们进行zmq开发由很多的选择,比较常用的有clrzmq4和NetMQ. 其中clrzmq是基于libzmq的Inte ...
[react] 受控组件和非受控组件有什么区别？
[react] 受控组件和非受控组件有什么区别? 受控组件用value和组件的state绑定,当value更新时,会自动更新state 非受控组件没有value,采用ref直接操作dom 个人简介我 ...
beeshell —— 开源的 React Native 组件库
背景 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...
组件和高阶组件区别_为什么要对高阶组件使用代码拆分
组件和高阶组件区别 by Nitish Phanse 由Nitish Phanse 为什么要对高阶组件使用代码拆分 (Why you should use code splitting with hi ...

zul组件、zhtml组件、native组件的区别

zul组件、zhtml组件、native组件的区别相关推荐

最新文章

热门文章