How to use the omi.h function in omi

To help you get started, we’ve selected a few omi examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Tencent / omi / packages / omi-mp / dist / src / mp / components / my-ele / my-ele.js View on Github external
function render() {
  return h('div', null, [h('my-child', null, []), h('div', null, ['my-ele'])])
}
// components/my-ele/my-ele.js
github Wscats / piano / src / elements / app-piano / index.js View on Github external
this.data.pianoKeys.map(item => {
          return h(
            "div",
            {
              class: "piano-key"
            },
            h(
              "div",
              {
                "data-type": "white",
                ref: e => {
                  this[item.white.name] = e;
                },
                class: "piano-key__white",
                onClick: this.playNote.bind(this, item.white.name),
                "data-key": item.white.keyCode,
                "data-note": item.white.name
              },
              h(
                "span",
                {
                  class: "piano-note"
                },
github Tencent / omi / packages / omi-cli / template / app / src / elements / app-omil / index.js View on Github external
render() {
    return h(
      "div",
      {
        class: "app-omil"
      },
      h(
        "button",
        {
          onClick: this.omiSnippets.bind(this),
          class: "weui-btn weui-btn_primary",
          style: "width: 200px;"
        },
        this.data.title
      )
    );
  }
github Tencent / omi / packages / omi-mp-douban / src / mp / pages / index / index.js View on Github external
return showLoading? [h('div',{'class': `page-loading`},[h('span',{'class': `weui-loading`},[]),h('span',{'class': `loading-text`},[`玩命加载中`])])]: [h('div',{'scroll-y': `true`,'class': `container film-list `},[ [films.map((film,index)=>{
        return h('div',{'class': `film-item`,'ontap': this.viewDetail,'data-id': film.id,'data-title': film.title},[h('div',{'class': `film-image`},[h('img',{'src': film.images.medium},[])]),h('div',{'class': `film-info`},[h('div',null,[h('span',{'class': `film-title`},[`${film.title}`]),h('span',{'class': `film-year`},[`${film.year}`])]),h('div',{'class': `film-rating`},[film.rating.average>0? [h('span',{'class': `label`},[`评分`]),h('span',{'class': `rating`},[`${film.rating.average}`])]: [h('span',{'class': `label`},[`暂无评分`])]]),h('div',{'class': `directors`},[h('span',{'class': `label`},[`导演`]), [film.directors.map((director,index)=>{
        return h('span',{'class': `person`},[`${director.name}`])
      })]]),h('div',{'class': `casts`},[h('span',{'class': `label`},[`主演`]), [film.casts.map((cast,index)=>{
        return h('span',{'class': `person`},[`${cast.name}`])
      })]])])])
      })],h('div',{'class': `load-more-wrap`},[hasMore? [h('div',{'class': `load-content`},[h('span',{'class': `weui-loading`},[]),h('span',{'class': `loading-text`},[`玩命加载中`])])]: [h('div',{'class': `load-content`},[h('span',null,[`没有更多内容了`])])]])])]
github Tencent / omi / packages / omi-mp / src / mp / components / my-ele / my-ele.js View on Github external
function render() {
  const { name, age } = this.data;
  return h("div", null, [
    h("button", { ontap: this.myMethods, onclick: this.myMethods }, [
      `Click me will log dntzhang to the console panel`
    ]),
    h("div", null, [`props - name:${name}, age:${age}`]),
    h("my-child", null, [])
  ]);
}
github Wscats / piano / src / elements / app-piano / index.js View on Github external
h(
          "div",
          null,
          this.store.data.count > 0
            ? h(
                "button",
                {
                  onClick: this.stopSong.bind(this),
                  class: "btn btn-outline-info btn-stop"
                },
                "Stop & \u6682\u505C"
              )
            : h(
                "div",
                null,
                h(
                  "button",
                  {
                    onClick: this.playSong.bind(this, moon),
                    class: "btn btn-outline-info"
                  },
                  "\u6708\u4EAE\u4EE3\u8868\u6211\u7684\u5FC3"
                ),
                h(
                  "button",
                  {
                    onClick: this.playSong.bind(this, pgydyd),
                    class: "btn btn-outline-info"
                  },
                  "\u84B2\u516C\u82F1\u7684\u7EA6\u5B9A"
                ),
                h(
github Wscats / piano / src / elements / app-header / index.js View on Github external
render(props) {
    return h(
      "div",
      null,
      h(
        "div",
        {
          style: "background: rgb(51, 51, 51) none repeat scroll 0% 0%;"
        },
        h(
          "div",
          {
            class: "container"
          },
          h(
            "div",
            {
              class: "text-sm-center text-white py-5"
            },
            h("h1", null, "Omi Piano"),
            h(
              "p",
              null,
              "An interactive piano keyboard for omi. Supports custom sounds,",
              h("br", {
                class: "d-none d-sm-block"
              }),
              "touch/click/keyboard events, and fully auto play song."
            ),
            h(
              "div",
github Wscats / piano / src / elements / app-footer / index.js View on Github external
class: "app-footer"
      },
      h("hr", {
        class: "mt-5"
      }),
      h(
        "div",
        {
          class: "row mt-5"
        },
        h(
          "div",
          {
            class: "col"
          },
          h(
            "div",
            {
              class: "text-center"
            },
            h(
              "p",
              {
                class: "mt-4"
              },
              "You can click on the keyboard and play the melody that belongs to you. Here is an example of a piano piece:"
            ),
            h(
              "p",
              null,
              "\u4F60\u53EF\u4EE5\u70B9\u51FB\u952E\u76D8\u4F9D\u987A\u5E8F\u6309\u4EE5\u4E0B\u952E\uFF0C\u63A7\u5236\u597D\u8282\u594F\u6F14\u594F\u5C5E\u4E8E\u4F60\u7684\u65CB\u5F8B\uFF0C\u4E0B\u9762\u662F\u4E00\u9996\u94A2\u7434\u66F2\u7684\u4F8B\u5B50:"
            ),
github Wscats / piano / src / elements / app-footer / index.js View on Github external
}
            })
          )
        )
      ),
      h(
        "div",
        {
          class: "bg-yellow mt-5 py-5"
        },
        h(
          "div",
          {
            class: "container"
          },
          h(
            "div",
            {
              class: "text-center text-secondary"
            },
            "Made with ",
            h(
              "span",
              {
                role: "img",
                "aria-label": "keyboard emoji"
              },
              "\uD83C\uDFB5"
            ),
            "by ",
            h(
              "a",
github Wscats / piano / src / elements / app-header / index.js View on Github external
{
                  class: "btn btn-outline-light btn-lg",
                  href: "https://github.com/Wscats/piano"
                },
                "\u67E5\u770B\u8BE5\u9879\u76EEGithub\u5730\u5740"
              )
            )
          )
        )
      ),
      h(
        "div",
        {
          class: "text-center"
        },
        h(
          "p",
          {
            class: ""
          },
          "Try it by clicking, tapping, or using your keyboard 1 to 9:"
        ),
        h(
          "p",
          {
            class: ""
          },
          "\u9F20\u6807\u70B9\u51FB\u94A2\u7434\u952E\u6216\u8005\u952E\u76D8\u6309\u6570\u5B57\u952E 1 ~ 9:"
        ),
        h(
          "div",
          {

omi

<p align="center"><img src="https://omijs.github.io/home/assets/logo.svg" alt="omi" width="100"/></p> <h2 align="center">Omi - Web Components Framework</h2>

MIT
Latest version published 24 days ago

Package Health Score

76 / 100
Full package analysis