當前位置: 首頁>>代碼示例>>TypeScript>>正文


TypeScript dom.prop方法代碼示例

本文整理匯總了TypeScript中index.dom.prop方法的典型用法代碼示例。如果您正苦於以下問題:TypeScript dom.prop方法的具體用法?TypeScript dom.prop怎麽用?TypeScript dom.prop使用的例子?那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在index.dom的用法示例。


在下文中一共展示了dom.prop方法的1個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。

示例1: testDom

function testDom() {
  const value = observable("apple");
  const choices = obsArray<IOption<string>>(["acorn", "apple", "orange", "papaya"]);

  let textarea: HTMLTextAreaElement;

  function parseChoices() {
    choices.set(textarea.value.trim().split("\n"));
  }

  const numChoices: Array<IOptionFull<number>> = [
    {value: 1.5, label: "A1"},
    {value: 2.1, label: "B2", disabled: true},
    {value: 3.9, label: "C3"},
  ];
  const numValue = observable(numChoices[2].value);

  return [
    dom('div#test_main',
      select(value, choices, {defLabel: "Select a fruit:"}),
      dom('div', "Current value: ",
        dom('input#test_value', {type: 'text'}, dom.prop('value', value),
          dom.on('input', (e, elem) => value.set((elem as HTMLInputElement).value))),
      ),
      textarea = dom('textarea', {rows: "10"}, choices.get().join("\n"),
        dom.on('blur', parseChoices),
      ) as HTMLTextAreaElement,
      dom('div',
        dom('input', {type: 'button', value: 'Update'}, dom.on('click', parseChoices)),
      ),
    ),
    dom('div#test_array',
      select(value, ["apple", "cherry", "tomato", "orange"]),
    ),
    dom('div#test_num',
      select(numValue, numChoices),
      dom('div', "Current value:", dom('br'),
        dom('input#test_num_value', {type: 'text', size: "6"}, dom.prop('value', numValue),
          dom.on('input', (e, elem) => {
            const val = (elem as HTMLInputElement).value;
            const n = parseFloat(val);
            if (!isNaN(n)) { numValue.set(n); }
          })),
        " type: ",
        dom('b#test_num_type', dom.text((use) => String(typeof use(numValue)))),
      ),
    ),
  ];
}
開發者ID:gristlabs,項目名稱:grainjs,代碼行數:49,代碼來源:index.ts


注:本文中的index.dom.prop方法示例由純淨天空整理自Github/MSDocs等開源代碼及文檔管理平台,相關代碼片段篩選自各路編程大神貢獻的開源項目,源碼版權歸原作者所有,傳播和使用請參考對應項目的License;未經允許,請勿轉載。