本文整理汇总了TypeScript中mithril.prop函数的典型用法代码示例。如果您正苦于以下问题:TypeScript prop函数的具体用法?TypeScript prop怎么用?TypeScript prop使用的例子?那么, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了prop函数的8个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: createNodeMetaData
/**
* Stores TreeNode MetaData which can be visualized in various ways, like for example a check mark and an 'X' representing boolean values.
*
* @private
* @param {IMetaData} [metaData={}]
* @returns {INodeMetaData}
*/
function createNodeMetaData(metaData: INodeMetaDataOptions = {}): INodeMetaData {
return {
id: m.prop(metaData.id || ''),
type: m.prop(metaData.type || MetaDataTypes.STATUS),
value: m.prop(metaData.value),
tooltip: m.prop(metaData.tooltip || '')
}
}
示例2: createChildNodes
/**
* Transforms an array of objects and all its children recursively into NodeData objects.
*
* @private
* @param {ITreeDataGlobalOptions} globalConfig All given properties will be copied recursively into every newly created tree node.
* @param {Array<INodeDataOptionsObject>} nodeList An array of option objects to bootstrap new tree nodes.
* @param {INodeData} [parent] The parent NodeData object or undefined if it's a root node.
* @param {number} [index] A tree node's index (number) inside of its parent's children array property.
* @returns {Array<INodeData>}
*/
function createChildNodes(globalConfig: ITreeDataGlobalOptions, nodeList: Array<INodeDataOptionsObject>, parent?: INodeData, index?: number) {
let childNodes = []
if (nodeList && nodeList.length > 0) {
for (let i = 0, iMax = nodeList.length; i < iMax; i++) {
let nodeData = nodeList[i]
nodeData.root = globalConfig.root // global TreeData object
nodeData.state = globalConfig.state || {} // fetch the global state from the context
nodeData.events = globalConfig.events || {} // fetch the global event handlers from the context
let childNode: INodeData = createNodeData(nodeData)
childNode.index(index || 0) // remember the index
if (parent) {
// memorize the node's parent
childNode.parent(parent)
}
if (nodeData.children && nodeData.children.length > 0) {
// Recursively wade through the dataset and convert all Children to NodeData objects.
// But first inject the globalConfig object into the context of the createChildNodes function.
childNode.children = m.prop(createChildNodes(globalConfig, nodeData.children, childNode, (i + 1)))
}
// wrap the NodeData objects into getters and setters through m.prop()
childNodes.push(childNode)
}
}
return childNodes
}
示例3: function
const controller = function() {
let messages = m.prop([]);
let text = m.prop("");
const pushMessage = function(msg: String) {
messages().push(msg) // 破壊的変更死ね
m.redraw.strategy("all")
}
const conn = new WebSocket('ws://localhost:9080/room/any?name=someone');
conn.onopen = function(e) {
console.log("socket open!");
}
conn.onerror = function(e) {
console.log(e);
// 何か再接続の処理とか取れば良いのかな
}
conn.onmessage = function(e) {
console.log("receive message: " + e.data);
pushMessage(e.data);
};
return {
messages: messages,
text: text,
sendMessage: function() {
let t = text();
text("");
console.log("message " + t + " is sent!")
conn.send(t);
pushMessage(t);
}
};
}
示例4: constructor
constructor(id: number = 0) {
this.id = m.prop(id);
}
示例5: homeCtrl
export default function homeCtrl(vnode: Mithril.Vnode<{}>): void {
const nbConnectedPlayers = m.prop<number>();
const nbGamesInPlay = m.prop<number>();
const dailyPuzzle = m.prop<any>();
const weekTopPlayers = m.prop<Array<any>>([]);
const timeline = m.prop<Array<any>>([]);
function init() {
if (isForeground()) {
lobbyXhr(true).then(data => {
socket.createLobby(data.lobby.version, noop, {
n: (_: any, d: PongMessage) => {
nbConnectedPlayers(d.d);
nbGamesInPlay(d.r);
redraw();
}
});
});
Promise.all([
dailyPuzzleXhr(),
topPlayersOfTheWeekXhr()
])
.then(results => {
const [dailyData, topPlayersData] = results;
dailyPuzzle(dailyData.puzzle);
weekTopPlayers(topPlayersData);
})
.catch(console.error.bind(console));
timelineXhr()
.then(data => {
timeline(
data.entries
.filter((o: TimelineEntry) => supportedTimelineTypes.indexOf(o.type) !== -1)
.slice(0, 10)
);
})
.catch(console.error.bind(console));
}
}
function onResume() {
setForeground();
init();
}
if (hasNetwork()) {
init();
}
document.addEventListener('online', init);
document.addEventListener('resume', onResume);
vnode.state = {
nbConnectedPlayers,
nbGamesInPlay,
dailyPuzzle,
timeline,
weekTopPlayers,
init,
onResume
};
}
示例6: function
export default function(root: AnalyseCtrlInterface, allow: boolean): ExplorerCtrlInterface {
const allowed = m.prop(allow);
const enabled = m.prop(false);
const loading = m.prop(true);
const failing = m.prop(false);
const current: Mithril.Property<ExplorerData> = m.prop({
moves: []
});
function open() {
backbutton.stack.push(close);
helper.analyticsTrackView('Analysis Explorer');
enabled(true);
}
function close(fromBB?: string) {
if (fromBB !== 'backbutton' && enabled()) backbutton.stack.pop();
enabled(false);
setTimeout(() => root && root.debouncedScroll(), 200);
}
let cache: {[index: string]: ExplorerData} = {};
function setResult(fen: string, data: ExplorerData) {
cache[fen] = data;
current(data);
}
function onConfigClose(changed: boolean) {
if (changed) {
cache = {};
setStep();
}
}
const withGames = isSynthetic(root.data) || gameApi.replayable(root.data) || !!root.data.opponent.ai;
const effectiveVariant: VariantKey = root.data.game.variant.key === 'fromPosition' ? 'standard' : root.data.game.variant.key;
const config = explorerConfig.controller(root.data.game.variant, onConfigClose);
const debouncedScroll = debounce(() => {
const table = document.getElementById('explorerTable');
if (table) table.scrollTop = 0;
}, 200);
function handleFetchError() {
loading(false);
failing(true);
redraw();
}
const fetchOpening = debounce((fen: string) => {
return openingXhr(effectiveVariant, fen, config.data, withGames)
.then((res: ExplorerData) => {
res.opening = true;
res.fen = fen;
setResult(fen, res);
loading(false);
failing(false);
redraw();
})
.catch(handleFetchError);
}, 1000);
const fetchTablebase = debounce((fen: string) => {
return tablebaseXhr(root.vm.step.fen)
.then((res: ExplorerData) => {
res.tablebase = true;
res.fen = fen;
setResult(fen, res);
loading(false);
failing(false);
redraw();
})
.catch(handleFetchError);
}, 500);
function fetch(fen: string) {
const hasTablebase = effectiveVariant === 'standard' || effectiveVariant === 'chess960';
if (hasTablebase && withGames && tablebaseRelevant(fen)) return fetchTablebase(fen);
else return fetchOpening(fen);
}
const empty: ExplorerData = {
opening: true,
moves: []
};
function setStep() {
if (!enabled()) return;
const step = root.vm.step;
if (step.ply > 50 && !tablebaseRelevant(step.fen)) {
setResult(step.fen, empty);
}
const fromCache = cache[step.fen];
if (!fromCache) {
loading(true);
fetch(step.fen);
} else {
current(fromCache);
//.........这里部分代码省略.........
示例7: constructor
constructor() {
this.vm = new SampleModel();
this.message = m.prop("");
}
示例8: createNodeData
export function createNodeData(dataset: INodeDataOptionsObject): INodeData {
if (!dataset) {
throw new Error('[Initialization Error] Dataset is empty! Given dataset: ' + (dataset.toString() || 'undefined'))
}
/**
* @private
* @type {TreeData}
*/
let root = dataset.root
dataset.state = dataset.state || {} // ensure that state is defined
/**
* @private
* @type {string}
*/
let newId = (!dataset.id) ? createId(dataset.title) : dataset.id
let nodeData: INodeData = {
/**
* Getter/setter for the parent node object or undefined if it is a root node.
*
* @function
* @param {NodeData} [parent] Parent node.
* @returns {NodeData} Parent node.
*/
parent: m.prop(dataset.parent),
/**
* Getter/setter for the node's unique identifier.
*
* @function
* @param {string} id The node's unique identifier.
* @returns {string} The node's unique identifier.
*/
id: m.prop(newId),
/**
* Getter/setter for the node's title.
*
* @function
* @param {string} [title] The node's title.
* @returns {string} The node's title.
*/
title: ((initialValue) => {
let cachedTitle = initialValue
return (title) => {
if (title) {
m.startComputation()
cachedTitle = title
radio(PubSubTopics.TREE_STRUCTURE_CHANGED).broadcast()
m.endComputation()
}
return cachedTitle
}
})(dataset.title || 'New Node'),
/**
* Getter/setter to indicate if this node cannont have child nodes.
*
* @function
* @param {boolean} [isLeaf=false] Indicates if this node cannont have child nodes.
* @returns {boolean} Indicates if this node cannont have child nodes.
*/
isLeaf: m.prop(dataset.isLeaf || false),
/**
* Getter/setter for an array of the node's child nodes.
*
* @function
* @param {Array<NodeData>} [children=[]] The node's child nodes
* @returns {Array<NodeData>} The node's child nodes
*/
children: m.prop(dataset.children || []),
/**
* Getter/setter for the node's index inside of its parent's array of child nodes ("children").
*
* @function
* @param {number} [index=0] Index inside of parent node's children array.
* @returns {number} Index inside of parent node's children array.
*/
index: m.prop(dataset.index || 0),
/**
* Getter/setter for the node's expanded state.
* This adds a CSS class to permanantly change the way the node (the whole row) looks. Collapsing a node will restore the old looks.
*
* @function
* @param {boolean} [expanded=false] Indicates wether the node is in expanded state.
* @returns {boolean} Indicates wether the node is in expanded state.
*/
expanded: m.prop(dataset.state.expanded || false),
/**
* Getter/setter for the node's highlighted state.
* This adds a CSS class to make the node very easy to spot.
*
* @function
* @param {boolean} [highlighted=false] Indicates wether the node is in highlighted state.
* @returns {boolean} Indicates wether the node is in highlighted state.
*/
highlighted: m.prop(dataset.state.highlighted || false),
/**
* Getter/setter for the node's blurred state.
* This adds a CSS class to make the node a bit more difficult to see.
*
* @function
//.........这里部分代码省略.........