回答編集履歴
2
kahitu
answer
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
### 結論
|
|
1
|
-
|
|
2
|
+
classListの仕様ではなく`Web Components`で実現しているからでした。（ソウイエバカイテアッタナー）
|
|
2
3
|
|
|
4
|
+
### Monacaのアーキテクチャー
|
|
3
5
|
[先進的なアーキテクチャー](https://ja.onsen.io/v2/guide/index.html#onsen-uitoha)
|
|
4
6
|
> 先進的なアーキテクチャー
|
|
5
7
|
> Onsen UIの中身は3つのレイヤーで作られています。
|
|
@@ -10,9 +12,12 @@
|
|
|
10
12
|
0. 独自のタグをjavascriptでclassで作成可能
|
|
11
13
|
0. 通常のタグと同じく、属性値を変えたら即反映（なんかうまいこと(^^;)してlistenしているんでしょうな。[slim.js](http://slimjs.com/#/data-binding)なのかな？
|
|
12
14
|
|
|
15
|
+
### 結論に至った経緯
|
|
13
16
|
属性変更を検知するのって[MutationObserver](https://developer.mozilla.org/ja/docs/Web/API/MutationObserver)くらいしか知らなくて、onsenui.jsを調べたけど見つからず…
|
|
14
17
|
下のコードで調べた時に`5.icon指定無しなら`の動作がどうしてもしっくりこない。タグ名で検索したら何だこのソースは？→そうか、これが`Web Components`か→あーicon属性なかったら動きそうにないなぁ ってところまで確認しました。
|
|
18
|
+
var icon = （略）'<ons-icon icon="' + `this.getAttribute('icon')` + '"></ons-icon>');
|
|
15
19
|
|
|
20
|
+
|
|
16
21
|
```JS
|
|
17
22
|
<p>1.フォトシェアアプリのコード</p>
|
|
18
23
|
<p>アイコン指定に関してはiconのほうが優先</p>
|
1
ぬけ追加。もう寝ます
answer
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
`Web Components`については以下くらいしか理解してません。（想像大いに入っている）
|
|
10
10
|
0. 独自のタグをjavascriptでclassで作成可能
|
|
11
|
-
0. 通常のタグと同じく、属性値を変えたら即反映（なんかうまいこと(^^;してlistenしているんでしょうな。[slim.js](http://slimjs.com/#/data-binding)
|
|
11
|
+
0. 通常のタグと同じく、属性値を変えたら即反映（なんかうまいこと(^^;)してlistenしているんでしょうな。[slim.js](http://slimjs.com/#/data-binding)なのかな？
|
|
12
12
|
|
|
13
13
|
属性変更を検知するのって[MutationObserver](https://developer.mozilla.org/ja/docs/Web/API/MutationObserver)くらいしか知らなくて、onsenui.jsを調べたけど見つからず…
|
|
14
14
|
下のコードで調べた時に`5.icon指定無しなら`の動作がどうしてもしっくりこない。タグ名で検索したら何だこのソースは？→そうか、これが`Web Components`か→あーicon属性なかったら動きそうにないなぁ ってところまで確認しました。
|