mirror of
https://github.com/bobwen-dev/react-templates
synced 2025-04-12 00:56:39 +02:00
fix #191, allow use of 'class' in custom-elements
This commit is contained in:
parent
a4962c5946
commit
079f5da0d1
@ -199,6 +199,12 @@ function generateProps(node, context) {
|
|||||||
});
|
});
|
||||||
_.assign(props, generateTemplateProps(node, context));
|
_.assign(props, generateTemplateProps(node, context));
|
||||||
|
|
||||||
|
// map 'className' back into 'class' for custom elements
|
||||||
|
if (props[reactSupport.classNameProp] && isCustomElement(node.name)) {
|
||||||
|
props[classAttr] = props[reactSupport.classNameProp];
|
||||||
|
delete props[reactSupport.classNameProp];
|
||||||
|
}
|
||||||
|
|
||||||
const propStr = _.map(props, (v, k) => `${JSON.stringify(k)} : ${v}`).join(',');
|
const propStr = _.map(props, (v, k) => `${JSON.stringify(k)} : ${v}`).join(',');
|
||||||
return `{${propStr}}`;
|
return `{${propStr}}`;
|
||||||
}
|
}
|
||||||
@ -252,14 +258,17 @@ function convertTagNameToConstructor(tagName, context) {
|
|||||||
const targetSupport = reactNativeSupport[context.options.nativeTargetVersion];
|
const targetSupport = reactNativeSupport[context.options.nativeTargetVersion];
|
||||||
return _.includes(targetSupport.components, tagName) ? `${targetSupport.reactNative.name}.${tagName}` : tagName;
|
return _.includes(targetSupport.components, tagName) ? `${targetSupport.reactNative.name}.${tagName}` : tagName;
|
||||||
}
|
}
|
||||||
let isHtmlTag = _.includes(reactDOMSupport[context.options.targetVersion], tagName);
|
const isHtmlTag = _.includes(reactDOMSupport[context.options.targetVersion], tagName) || isCustomElement(tagName);
|
||||||
if (reactSupport.shouldUseCreateElement(context)) {
|
if (reactSupport.shouldUseCreateElement(context)) {
|
||||||
isHtmlTag = isHtmlTag || tagName.match(/^\w+(-\w+)$/);
|
|
||||||
return isHtmlTag ? `'${tagName}'` : tagName;
|
return isHtmlTag ? `'${tagName}'` : tagName;
|
||||||
}
|
}
|
||||||
return isHtmlTag ? `React.DOM.${tagName}` : tagName;
|
return isHtmlTag ? `React.DOM.${tagName}` : tagName;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isCustomElement(tagName) {
|
||||||
|
return tagName.match(/^\w+(-\w+)+$/);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {string} html
|
* @param {string} html
|
||||||
* @param options
|
* @param options
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
<div>
|
<div>
|
||||||
<custom-element></custom-element>
|
<custom-element></custom-element>
|
||||||
|
<my-custom-element class="a" className="b" rt-class="{c:1}" rt-props="{d:2}"></my-custom-element>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1 +1 @@
|
|||||||
<div><custom-element></custom-element></div>
|
<div><custom-element></custom-element><my-custom-element class="a b c" d="2"></my-custom-element></div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user