parcel+riot.js v4でstyleタグの挿入が上手くいかなかったときの対処法 - Qiita
<app> <style scoped> p { color: red; } </style> <!-- 文字が赤くなるはずだが･･･ --> <p>hello world!</p> </app> （めっちゃ簡略しています） 原因 調べてもよく分からず、しょうがないのでriot.jsのソースを見ることに。 cssManagerというシングルトン？がaddメソッドによってスタイル挿入を行っているらしい。 以下該当箇所を抜粋。 /** * Save a tag style to be later injected into DOM * @param { string } name - if it's passed we will map the css to a tagname * @param { string } css - css string * @returns {Object} s
Riot.js v4に対応したルーター、Riot Routerのbeta版がリリースされました！ | フロントエンドBlog | ミツエーリンクス
2019年9月27日 Riot.js v4に対応したルーター、Riot Routerのbeta版がリリースされました！ UI開発者 板垣 本日、すべてのRioterが待ち望んでいた、新しいRiot Routerのbeta版がリリースされました！ The new #riotjs route is in beta release https://t.co/uCZeTuQhVZ — Riot.js Framework (@riotjs_) 2019年9月26日 今回リリースされたルーターは、以下の機能を備えているようです。 history.pushStateおよびhistory APIとの互換性 isomorphic functional API erre.js streamsおよびJavaScriptのasync generators rawth.jsのURL解析 ※beta版のため、機能の修
How to call a function onclick and pass arguments · Issue #1001 · riot/riot
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community. Pick a username Email Address Password Sign up for GitHub By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails. Already on GitHub? Sign in to your account
validatorjs がとても便利だったので validatorjs-riot を作った - Qiita
// ES6 modules import Validator from 'validatorjs-riot'; // CommonJS modules let Validator = require('validatorjs-riot'); <input type="text" ref="name" validate="required" value="" /> <input type="text" ref="email" validate="required|email" value="not an email address.com" /> <button type="button" onclick="{ register }">登録する</button> <script> let Validator = require('validatorjs-riot'); this.error
riotで名前付きのyieldをネストさせると...... - Qiita
<yield-multi3> <yield to="header"> <span>header1</span> </yield> <yield-multi3> <yield to="header"> <span>header2</span> </yield> <span>content</span> </yield-multi3> </yield-multi3>
riotでjQueryを使わないスクロール止めの実装 - Qiita
背景 webページの一部のパーツがブラウザのスクロールに付いてくるようにしたい 例えばECサイトによくある、購入ボタンをブラウザのスクロールに追尾させて、 ユーザーがコンテンツのどこにを見ていても即座に商品をカートに入れれるようにしたい。 僕.「cssだけでできる?」 G .「position: stickyはどう」 僕.「いいやんけこれ」 僕.「IEもpolyfillあるし」 僕.「なんかうまいこといかん」 G .「親要素にoverflow(style)が使ってると動かんよ」 僕.「ぐぬぬ」 僕.「overflowいっぱい使ってるなあ・・・」 僕.「overflow外して良い？」 デ.「だめ」 僕.「ぐぬぬ」 ※Gはgoogle検索 ※デはデザイナーさん 僕.「ではscriptで対応するか・・・。」 G .「これなんか参考にならんか？ あとこれとか」 僕.「JQuery使ってるやつばっか
Ct.js — a free game editor
Meet ct.js,your new 2D game editorct.js makes learning programming fun and game development easy by its visual tools, good docs and flexible, modular library. It is free, open-source, and is loved by hobbyists, professionals, teachers, and their students. Download v3.2.0 Smooth workflowBad tools hinder your performance. Ct.js is designed to be like a brush with which you create games, not to be an
【RiotJS】preventUpdate を使いこなせ！ - Qiita
<todo> <input type="text" name="new"> <input type="button" value="add" onclick={add}> <ul> <li each={text, i in list}>{text}</li> </ul> <script> this.list = []; add() { this.list.push(this.new.value); } </script> </todo> こちらのinputの文字列をひたすらリストにしていくやつを例に使います。 これ、動きます（そりゃそうでしょうが）。 ただ、ここで疑問がわくわけです。 いつアップデート（再描画）されたんだ？？ 描画を再更新するのは 明示的に自身の update 関数を発火させるか、親が update されたタイミングです。 ですが、上記のサンプルでは update 関数も発
Riot.js x Firebaseで作る、超お手軽なパスワード不要のログインシステム「Magic Login」 - NOT SO BADなブログ
[2018年8月追記] 現在この機能はfirebase公式で提供されています。 このブログの実装方法もまだ使えますが、簡単なのでぜひ公式のをお使いください。 完全に使うあてもなく趣味で作った機能だったけど、 本体のSorceryにプルリク送ったらかなり歓迎されて、 あとはテストさえ書けば取り込んでもらえそうな状態です。 （じゃあ書けよっていう。。） https://github.com/Sorcery/sorcery/pull/8 しかし最近はFirebaseがマイブームなので、Firebase版のパスワードなしログインシステム「Magic Login」を実装してみました。 Firebaseには匿名認証の仕組みもあるので、ユーザー登録なしでも使えて、本登録するときは「MagicLogin」という組み合わせにすると、かなりいい感じになりましたよと。 環境Firebase: 3.5.0Riot
Riot.jsでどんどん重なっていくモーダルの背景色を薄いまま保つ - あーあーそのー
最近Riot.jsを使った案件をやっていて、そこで困ったことをどう解決したかを整理しておく。 やりたかったこと Webの表現ではよくあると思うのだけど、要素をクリックすると詳細な画面とかメッセージがポップアップっぽく表示されて、後ろが半透明の黒背景で覆われていて他の要素がクリックできないようになる、みたいな要件。 今回の要件では、モーダルの中で再び別の要素をクリックすると、それが更に重なってモーダルで表示されるというものになっていた。モーダルがどんどん重なっていく、ということ。 パーツ的には半透明の黒背景（以下、カバーって呼びます）とコンテンツという構成になっているので、何も考えずにカバーとコンテンツを束ねた、modal-content.tag のようなタグを作ってしまって、 mount して一番外側の div に appendChild するという感じにしたかった。 ただ、ここで問題にな
Show HTML as innerHTML in Riot.js each loop.
Riot.jsのeachループの中でデータをHTMLとして出力する方法。 Riot.jsの{}の値は常にエスケープされるため、例えば数式などで<sub>タグを 使った場合、タグはHTMLとして解釈されずそのまま文字列として表示されてしまいます。 Riotタグの中でHTMLを使いたい場合、色々ググってみた感じ、 一派的にはinnerHTMLとして出力するようです。 タグの中で一箇所出力する場合はinnerHTMLをそのまま使えば良いのですが、 Riotのeachループの中でHTMLを出力しようとした場合やや面倒だったので解決方法をメモしておきます。 <summary> <ul> <virtual each="{list}"> <div id={uid} ></div> </virtual> </ul> <script> fetch(何かのAPI) .then(function (data)
【第2回】React （JSフレームワーク他）x ビアバッシュ 初心者勉強会 in秋葉原 (2018/06/23 18:00〜)
UIに特化したReact周辺の勉強会、交流会です。 秋葉原から徒歩5分の貸切スペースで、飲み物片手に楽しく情報交換しましょう。お酒は飲み放題です♪ 勉強会の目標として以下を掲げています 各自のスキル向上を目指し、人生を豊かにする！ 刺激をもらってモチベーションを高める！ アウトプットは最大のインプット！ 学びの追体験、参加型の勉強会！ no drink, no hack! 経験者からの初心者に向けたLT登壇者も大募集！ ReactではなくてもJSフレームワークなど何でもどうぞ！（Vue.jsとかでも問題ありません） LT内容は決まり次第随時更新致します。 （LT枠は前回無料だったのですが、会場費とドリンクの都合で500円頂戴させてください。） ※※「登壇者の皆様へ」FaceBookのリンクが廃止されたため、連絡が取れなくなっております。（ツイッターでご連絡できる場合はそちらから連絡しておい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - Acesmndr/chrome-extension-boilerplate-riot: A boilerplate chrome extension (Single Page Application) using RIOT.js
えら on Twitter: "riot v4、以下のpolyfillを導入すれば少なくとも公式のサンプルがIE11で動いた。 Built with #Carbon, by @dawn_labs https://t.co/KmPJkHUZKN"
mk-engineer.com is Expired or Suspended.
Riot.js + Firebaseでリアルタイムのチャットを作ってみた - Qiita
https://pixel-ui.site/
GitHub - any-code/riot-i18n: Riot JS internationalization tag and mixin
riotタグにjsonで連想配列を渡してやるとvalueが消える件 - Qiita
【第2回】React （JSフレームワーク他）x ビアバッシュ 初心者勉強会 in秋葉原 - 資料一覧 - connpass
