本文整理匯總了TypeScript中react-dom/server.renderToStaticMarkup函數的典型用法代碼示例。如果您正苦於以下問題:TypeScript renderToStaticMarkup函數的具體用法?TypeScript renderToStaticMarkup怎麽用?TypeScript renderToStaticMarkup使用的例子?那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了renderToStaticMarkup函數的9個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: it
it('should render the main example', function () {
const TEXT_STYLE = Style.registerStyle({
backgroundColor: 'red'
})
const App = Style.component(React.createClass({
displayName: 'App',
render: function () {
return React.createElement(
'div',
{ className: TEXT_STYLE },
'Hello world!',
React.createElement(Style.Element)
)
}
}))
expect(renderToStaticMarkup(React.createElement(App))).to.equal(
'<div class="' + TEXT_STYLE + '">' +
'Hello world!' +
'<style>.' + TEXT_STYLE + '{background-color:red}</style>' +
'</div>'
)
})
示例2: print_code
export function print_code(opts: Options) {
const w = popup("");
let options = fromJS(opts.options);
options = options.delete("lineNumbers"); // doesn't work yet
// We add a trailing whitespace, since some printers grey the last line (e.g., chrome, but not firefox)
const value = opts.value + "\n";
const props = {
value,
options,
style: { background: "white", padding: "7%", width: "auto" },
no_border: true
};
const s: string = renderToStaticMarkup(
React.createElement(CodeMirrorStatic, props)
);
const t: string = `\
<html lang="en">
<head>
<title>${path_split(opts.path).tail}</title>
<meta name="google" content="notranslate"/>
<style>${CODEMIRROR_CSS}</style>
</head>
<body style='font-size:${opts.font_size}'>
${s}
</body>
</html>\
`;
w.document.write(t);
w.document.close();
print_window(w);
}
示例3: async
return async (req, res, next) => {
const session = app.createSession() as TuxServerSession
session.req = req
session.res = res
try {
const body = await app.renderServer(
session,
ReactDOMServer.renderToString
)
// render middlewares might respond early, eg redirects.
if (!res.headersSent) {
const html = createElement(
Document,
{
...session.document,
css: assets.css,
js: assets.js,
},
body
)
res.send('<!doctype html>' + ReactDOMServer.renderToStaticMarkup(html))
}
} catch (error) {
next(error)
}
}
示例4: handleRender
return function handleRender(req: express.Request, res: express.Response, next: express.NextFunction) {
// Ignote static assets
if (req.url.indexOf(".") === -1) {
let result = bootstrap({
container: "root",
createHistory: createMemoryHistory,
initialState: {},
middlewares: [thunk],
reducers: {
repos: reposReducer,
users: usersReducer
},
render: () => { /* skip first render, we navigate first */ },
routes: routes
});
result.history.push(req.url);
let state = result.store.getState();
let html = renderFullPage(
css,
renderToStaticMarkup(result.root),
JSON.stringify(state)
);
res.send(html);
} else {
next();
}
};
示例5: write_content
function write_content(w, opts: PrintOptions): void {
if (!opts.path) throw Error("write_content -- path must be defined");
const split = path_split(opts.path);
let html: string;
if (opts.html == null) {
const props = {
value: opts.value,
project_id: opts.project_id,
file_path: split.head
};
const C = React.createElement(
Redux,
{ redux } as any,
React.createElement(HTML, props)
);
html = ReactDOMServer.renderToStaticMarkup(C);
} else {
html = opts.html;
}
const title: string = path_split(opts.path).tail;
html = html_with_deps(html, title);
w.document.write(html);
w.document.close();
}
示例6: createElement
pages.forEach(({ fields }) => {
// render page
const Component = createElement(App, fields);
const markup = ReactDOMServer.renderToStaticMarkup(Component);
const html = generateHtml(markup);
// save page to disk
savePageToDisk(fields.slug, html);
});
示例7: createMessageFragment
function createMessageFragment(message: Message): DocumentFragment {
const reactTree = React.createElement(MessageItem, {
message: message,
});
const html = ReactDOMServer.renderToStaticMarkup(reactTree);
const range = document.createRange();
range.selectNode(document.body);
const fragment = range.createContextualFragment(html);
return fragment;
}
示例8: createChannelWindowListFragment
function createChannelWindowListFragment(list: Array<Channel>): DocumentFragment {
const reactTree = React.createElement(ChatWindowList, {
list: list,
});
const html = ReactDOMServer.renderToStaticMarkup(reactTree);
const range = document.createRange();
range.selectNode(document.body);
const fragment = range.createContextualFragment(html);
return fragment;
}
示例9: createChannelFragment
function createChannelFragment(domain: ChannelDomain): DocumentFragment {
const reactTree = React.createElement(ChatWindowItem, {
channel: domain.getValue(),
});
const html = ReactDOMServer.renderToStaticMarkup(reactTree);
const range = document.createRange();
range.selectNode(document.body);
const fragment = range.createContextualFragment(html);
return fragment;
}