RiotJS を使用して、ユーザーが変更できる contenteditable div を持つ単純な要素を作成しました (myFunction はいくつかの基準に従ってスタイルを設定します)。
今、私は自分のウェブサイトの最初と最後にその要素を持ちたいと思っており、それらは互いに同期している必要があります...それはまったく可能ですか?
そうでない場合、一方向のデータバインディングを行うことは可能ですか (上部の要素の変更は下部の要素に表示されますが、必ずしもその逆ではありません)。
または、単純にテキスト (編集不可で、同じ riot 要素を含まない) を下部に表示することもできます...
RiotJS 要素: (コードはこれまでのところ機能していますが、コードの一部にいくつかの小さなエラーがある可能性があります。これは、私が作業しているものを削減し、わずかに変更したバージョンであるためです :-))
<my-element>
<div id="content" contenteditable="true" onkeyup="{myFunction}">{editableText}</div>
<style>...</style>
<script>
this.editableText = opts.text
... // more content
</script>
</my-element>
HTML でのマウント:
<html>
<!-- start of page content -->
<my-element></my-element>
<script src="{%=URL(r=request,c='static/js/riot',f='my-element.tag')%}" type="riot/tag"></script>
{%element_text_or_empty = XML(T(someText.content)) if someText else ''%}
<script>
var textToUse = "{%=element_text_or_empty%}";
riot.mount('my-element', {text: textToUse})
</script>
<!-- more content -->
<!-- repeat my-element with same (edited) content as above -->
<!-- what to write here? -->
</html>
注: 私は web2py フレームワークを使用しています。
{%element_text_or_empty = XML(T(someText.content)) if someText else ''%}
の部分が由来です。