代码之家 › 专栏 › 技术社区 › Bjørn Stenfeldt

无法在JSF facelets中使用VueJS属性前缀

jsf-2.2 jsf-2 jsf

2

Bjørn Stenfeldt · 技术社区 · 8 年前

我在我的JSF facelets中添加了如下内容:

<html xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html">
    <f:view>
        <h:head></h:head>
        <h:body>
            <todo-item
                v-for="item in groceryList"
                v-bind:todo="item"
                v-bind:key="item.id">
            </todo-item>
            ...
        </h:body>
    </f:view>
</html>

并获取错误:

The prefix "v-bind" for attribute "v-bind:todo" associated with an element type "todo-item" is not bound.

我理解问题所在。未在HTML元素上定义命名空间。但我怎么能呢?我试过使用 xmlns:p="http://xmlns.jcp.org/jsf/passthrough" , p:v-bind:todo 和 p:v-bind:key ,但这是一个远大的目标,没有成功。

2 回复 | 直到 8 年前

1

3

Bjørn Stenfeldt 8 年前

我最终只是这样做:

<html xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:v-bind="http://xmlns.jcp.org/jsf/passthrough">
    <f:view>
        <h:head></h:head>
        <h:body>
            <todo-item
                v-for="item in groceryList"
                v-bind:todo="item"
                v-bind:key="item.id">
            </todo-item>
            ...
        </h:body>
    </f:view>
</html>

2

0

Mircea Stanciu 8 年前

VUE和JSF2之间的婚姻简直是地狱般的。我想使用JSF2的facelets模板和模型绑定以及VUE的前端魔力

最终得出如下结论:

xmlns:v-on="http://xmlns.jcp.org/jsf/passthrough"
xmlns:v-bind="http://xmlns.jcp.org/jsf/passthrough"

将JSF绑定到支持bean并绑定到vue以进行前端验证

<h:inputText a:placeholder="eMail" maxlength="17" value="#{LoginBean.email}" a:v-model="email"/>

使用vue绑定css类和条件呈现

<div class="button" v-bind:class="{ disabled: !login_enabled }">
    <span v-if="login_enabled">
        <h:commandLink action="#{LoginBean.submit}">
            <span class="button-title">Submit</span>
            <f:ajax execute="@form"/>
        </h:commandLink>
    </span>
    <span v-if="!login_enabled" class="button-title">Submit</span>
</div>

老实说,我不确定这是否适合我的项目。就目前而言,它是有效的,稍后再看。