Added rt-require example to show amd and commonjs support
This commit is contained in:
parent
8ef5be16bf
commit
d87b86b960
File diff suppressed because one or more lines are too long
|
@ -5,8 +5,9 @@ define(['lodash', 'react', './examples.rt',
|
|||
'text!./samples/rt-if.code', 'text!./samples/rt-if.rt',
|
||||
'text!./samples/rt-props.code', 'text!./samples/rt-props.rt',
|
||||
'text!./samples/rt-repeat.code', 'text!./samples/rt-repeat.rt',
|
||||
'text!./samples/weather.code', 'text!./samples/weather.rt'
|
||||
], function (_, React, examplesTemplate, helloCode, helloRT, todoCode, todoRT, rtIfCode, rtIfRT, rtPropsCode, rtPropsRT, rtRepeatCode, rtRepeatRT, weatherCode, weatherRT) {
|
||||
'text!./samples/weather.code', 'text!./samples/weather.rt',
|
||||
'text!./samples/rt-require.rt'
|
||||
], function (_, React, examplesTemplate, helloCode, helloRT, todoCode, todoRT, rtIfCode, rtIfRT, rtPropsCode, rtPropsRT, rtRepeatCode, rtRepeatRT, weatherCode, weatherRT, rtRequireRT) {
|
||||
var samples = {
|
||||
hello: [helloCode, helloRT],
|
||||
todo: [todoCode, todoRT],
|
||||
|
@ -26,9 +27,10 @@ define(['lodash', 'react', './examples.rt',
|
|||
displayName: 'Examples',
|
||||
mixins: [React.addons.LinkedStateMixin],
|
||||
getInitialState: function () {
|
||||
var codeAmd = window.reactTemplates.convertTemplateToReact(helloRT, {modules: 'amd', name: 'template'});
|
||||
var codeCJS = window.reactTemplates.convertTemplateToReact(helloRT, {modules: 'commonjs', name: 'template'});
|
||||
var codeAmd = window.reactTemplates.convertTemplateToReact(rtRequireRT, {modules: 'amd', name: 'template'});
|
||||
var codeCJS = window.reactTemplates.convertTemplateToReact(rtRequireRT, {modules: 'commonjs', name: 'template'});
|
||||
return {
|
||||
rtRequire: {value: rtRequireRT},
|
||||
amd: {value: codeAmd},
|
||||
cjs: {value: codeCJS},
|
||||
samples: samples
|
||||
|
|
|
@ -44,17 +44,24 @@
|
|||
</p>
|
||||
<playground id="weatherExample" rt-props="this.state.samples.weather" direction="horizontal"></playground>
|
||||
</div>
|
||||
<div id="rt-require" class="example">
|
||||
<h3>rt-require</h3>
|
||||
<p>
|
||||
This example shows how to load other react components and libraries into a react-template and use them in the template
|
||||
</p>
|
||||
<viewer rt-props="this.state.rtRequire" mode="javascript" />
|
||||
</div>
|
||||
<div id="amd" class="example">
|
||||
<h3>AMD</h3>
|
||||
<p>
|
||||
This example shows the hello sample output with AMD support.
|
||||
This example shows the rt-require sample output with AMD support
|
||||
</p>
|
||||
<viewer rt-props="this.state.amd" mode="javascript" />
|
||||
</div>
|
||||
<div id="commonjs" class="example">
|
||||
<h3>CommonJS</h3>
|
||||
<p>
|
||||
This example shows the hello sample output with CommonJS support.
|
||||
This example shows the rt-require sample output with CommonJS support
|
||||
</p>
|
||||
<viewer rt-props="this.state.cjs" mode="javascript" />
|
||||
</div>
|
||||
|
|
|
@ -25,11 +25,14 @@ define([
|
|||
'id': 'weatherExample',
|
||||
'direction': 'horizontal'
|
||||
}, this.state.samples.weather))), React.createElement('div', {
|
||||
'id': 'rt-require',
|
||||
'className': 'example'
|
||||
}, React.createElement('h3', {}, 'rt-require'), React.createElement('p', {}, '\n This example shows how to load other react components and libraries into a react-template and use them in the template\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.rtRequire))), React.createElement('div', {
|
||||
'id': 'amd',
|
||||
'className': 'example'
|
||||
}, React.createElement('h3', {}, 'AMD'), React.createElement('p', {}, '\n This example shows the hello sample output with AMD support.\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.amd))), React.createElement('div', {
|
||||
}, React.createElement('h3', {}, 'AMD'), React.createElement('p', {}, '\n This example shows the rt-require sample output with AMD support\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.amd))), React.createElement('div', {
|
||||
'id': 'commonjs',
|
||||
'className': 'example'
|
||||
}, React.createElement('h3', {}, 'CommonJS'), React.createElement('p', {}, '\n This example shows the hello sample output with CommonJS support.\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.cjs))));
|
||||
}, React.createElement('h3', {}, 'CommonJS'), React.createElement('p', {}, '\n This example shows the rt-require sample output with CommonJS support\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.cjs))));
|
||||
};
|
||||
});
|
|
@ -0,0 +1,5 @@
|
|||
<rt-require dependency="comps/myComp" as="myComp"/>
|
||||
<rt-require dependency="utils/utils" as="utils"/>
|
||||
<div>
|
||||
<myComp customProp="{utils.doSomething()}">myComp is just a regular tag</myComp>
|
||||
</div>
|
Loading…
Reference in New Issue