EasyUI Forum
April 28, 2024, 10:41:15 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Expanding custom component issues based on easyui  (Read 5493 times)
fengdie
Jr. Member
**
Posts: 87


View Profile Email
« on: October 30, 2018, 11:00:56 PM »

The project uses NPM to load easyui. I want to extend a component based on 'InputBase' but cannot export the 'INPUTBASE_INNER_TEMPLATE' constant
项目中是使用NPM加载easyui的。我想扩展一个组件是基于'InputBase' 但是无法导出'INPUTBASE_INNER_TEMPLATE'常量

INPUTBASE_INNER_TEMPLATE is undefined

Code:
<script>
import { InputBase, INPUTBASE_INNER_TEMPLATE } from 'vx-easyui'

export const UI_USER_QUERY_TEMPLATE = `
<span class="f-field">
   ` + INPUTBASE_INNER_TEMPLATE + `

</span>
`

export default {
    name: 'ui-user-query',
    extends: InputBase,
    template: UI_USER_QUERY_TEMPLATE,
}
</script>
« Last Edit: October 30, 2018, 11:02:29 PM by fengdie » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: October 31, 2018, 12:29:37 AM »

The InputBase component is used internally, please extend from TextBox component instead.
Code:
<template>
<span class="f-field" :class="baseClasses">
    <input v-if="!multiline" ref="inputRef" autocomplete="off"
            :class="inputClasses"
            :style="inputStyle"
            :value="text"
            :id="inputId"
            :disabled="disabled?'disabled':null"
            :readonly="(readonly||!editable)?'readonly':null"
            :tabindex="tabindex"
            :placeholder="placeholder"
            @input="onInput($event)"
            @focus="focus()"
            @blur="blur()">
    <input class="textbox-value" type="hidden" :value="valueState" :disabled="disabled?'disabled':null">
    <slot></slot>
    <span ref="addonRef" v-if="iconCls" :class="addonClasses">
        <span :class="addonIconClasses"></span>
    </span>
</span>
</template>
<script>
import { TextBox } from 'vx-easyui';
export default {
name: 'MyInput',
extends: TextBox
}
</script>
Logged
fengdie
Jr. Member
**
Posts: 87


View Profile Email
« Reply #2 on: November 01, 2018, 05:43:29 AM »

Please modify the 'src\easyui\src\components\base\index.js' file to export the InputBase file.
Code:
import VirtualScroll from './VirtualScroll';
import InputBase from './InputBase';
import Addon from './Addon';
import Label from './Label';

export {
    VirtualScroll,
    InputBase,
    Addon,
    Label
}
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!