1
0
mirror of https://github.com/bobwen-dev/react-templates synced 2025-04-12 00:56:39 +02:00

added better rt-props support use assign instead of merge and merge correctly style and className

This commit is contained in:
avim 2015-02-26 10:48:44 +02:00
parent 6826a880ef
commit faa6b1adf2
5 changed files with 17 additions and 4 deletions

View File

@ -13,7 +13,9 @@ var RTCodeError = rtError.RTCodeError;
var repeatTemplate = _.template('_.map(<%= collection %>,<%= repeatFunction %>.bind(<%= repeatBinds %>))');
var ifTemplate = _.template('((<%= condition %>)?(<%= body %>):null)');
var propsTemplate = _.template('_.merge({}, <%= generatedProps %>, <%= rtProps %>)');
var propsTemplateSimple = _.template('_.assign({}, <%= generatedProps %>, <%= rtProps %>)');
var propsTemplate = _.template('mergeProps( <%= generatedProps %>, <%= rtProps %>)');
var propsMergeFunction = 'function mergeProps(inline,external) {\n var res = _.assign({},inline,external)\nif (inline.hasOwnProperty(\'style\')) {\n res.style = _.defaults(res.style, inline.style);\n}\n if (inline.hasOwnProperty(\'className\') && external.hasOwnProperty(\'className\')) {\n res.className = external.className + \' \' + inline.className;\n} return res;\n}\n';
var classSetTemplate = _.template('React.addons.classSet(<%= classSet %>)');
var simpleTagTemplate = _.template('<%= name %>(<%= props %><%= children %>)');
var tagTemplate = _.template('<%= name %>.apply(this,_.flatten([<%= props %><%= children %>]))');
@ -307,7 +309,16 @@ function convertHtmlToReact(node, context) {
}
data.props = generateProps(node, context);
if (node.attribs[propsProp]) {
data.props = propsTemplate({generatedProps: data.props, rtProps: node.attribs[propsProp]});
if (data.props === '{}') {
data.props = node.attribs[propsProp];
} else if (!node.attribs.style && !node.attribs.class) {
data.props = propsTemplateSimple({generatedProps: data.props, rtProps: node.attribs[propsProp]});
} else {
data.props = propsTemplate({generatedProps: data.props, rtProps: node.attribs[propsProp]});
if (!_.contains(context.injectedFunctions,propsMergeFunction)) {
context.injectedFunctions.push(propsMergeFunction);
}
}
}
if (node.attribs[ifProp]) {
data.condition = node.attribs[ifProp].trim();

1
test/data/props-class.rt Normal file
View File

@ -0,0 +1 @@
<input style="height:10px;width:3px;" rt-props="{style:{width:'5px'}, type:'text', className: 'clsB'}" class="clsA"/>

View File

@ -0,0 +1 @@
<input style="width:5px;height:10px;" class="clsB clsA" type="text">

View File

@ -1 +1 @@
<input alt="test rt-props" style="height:10px;width:5px;" type="text" value="test"/>
<input alt="test rt-props" style="width:5px;height:10px;" type="text" value="test">

View File

@ -160,7 +160,7 @@ function normalizeHtml(html) {
}
test('html tests', function (t) {
var files = ['scope.rt', 'lambda.rt', 'eval.rt', 'props.rt', 'custom-element.rt', 'style.rt', 'concat.rt', 'js-in-attr.rt'];
var files = ['scope.rt', 'lambda.rt', 'eval.rt', 'props.rt', 'custom-element.rt', 'style.rt', 'concat.rt', 'js-in-attr.rt', 'props-class.rt'];
t.plan(files.length);
files.forEach(check);