質問編集履歴

5

added

2021/08/25 03:33

投稿

Maar
Maar

スコア48

test CHANGED
File without changes
test CHANGED
@@ -20,6 +20,8 @@
20
20
 
21
21
  </template>
22
22
 
23
+
24
+
23
25
  <script>
24
26
 
25
27
  export default {
@@ -38,17 +40,23 @@
38
40
 
39
41
  </script>
40
42
 
43
+
44
+
41
45
  <style lang="scss" module>
42
46
 
43
- > span {
47
+ .wrap {
44
48
 
45
- font-size: 10px;
49
+ > span {
46
50
 
47
- }
51
+ font-size: 10px;
48
52
 
49
- > span.selected {
53
+ }
50
54
 
55
+ > span.selected {
56
+
51
- font-size: 100px;
57
+ font-size: 100px;
58
+
59
+ }
52
60
 
53
61
  }
54
62
 

4

追記

2021/08/25 03:33

投稿

Maar
Maar

スコア48

test CHANGED
File without changes
test CHANGED
@@ -10,35 +10,35 @@
10
10
 
11
11
  ```vue
12
12
 
13
- <span :class="{ selected: name }" @click="toggleSelect">{{name}}</span>
13
+ <template>
14
14
 
15
+ <div class="wrap">
15
16
 
17
+        <span :class="{ selected: name }" @click="toggleSelect">{{name}}</span>
16
18
 
19
+ </div>
17
20
 
21
+ </template>
18
22
 
19
- data() {
23
+ <script>
20
24
 
21
- return {
25
+ export default {
22
26
 
23
- name: false,
27
+ methods: {
24
28
 
25
- };
29
+    toggleSelect(){
26
30
 
27
- },
31
+    this.name = !this.name
28
32
 
29
- methods: {
33
+   }
30
34
 
31
- toggleSelect(){
35
+ },
32
36
 
33
- this.name = !this.name
37
+ };
34
38
 
35
- }
39
+ </script>
36
40
 
37
-
41
+ <style lang="scss" module>
38
-
39
-
40
-
41
-
42
42
 
43
43
  > span {
44
44
 
@@ -52,4 +52,6 @@
52
52
 
53
53
  }
54
54
 
55
+ </style>
56
+
55
57
  ```

3

修正

2021/08/25 03:32

投稿

Maar
Maar

スコア48

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,4 @@
1
- 現在vueを勉強中なのですが、classをトグルして文字のスタイルを変化させようとしても何故か変わりません。classにはselectedがちゃんと入っているのに.selectedのスタイルが適用されていないようです。
1
+ 現在vueを勉強中なのですが、classをトグルして文字のスタイルを変化させようとしても何故か変わりません。classにはselectedがちゃんと入っているのに.vueファイル内のspan.selectedのスタイルが適用されていないようです。
2
2
 
3
3
  vue特有の記述方法があるのでしょうか、ちなみに通常のcssファイルに書いたところ問題なく適用されていたのでcssの書き方は間違ってなさそうです。
4
4
 

2

追記

2021/08/25 01:41

投稿

Maar
Maar

スコア48

test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,6 @@
1
1
  現在vueを勉強中なのですが、classをトグルして文字のスタイルを変化させようとしても何故か変わりません。classにはselectedがちゃんと入っているのに.selectedのスタイルが適用されていないようです。
2
2
 
3
- vue特有の記述方法があるのでしょうか、ちなみにcssファイルに書いたところ問題なくました
3
+ vue特有の記述方法があるのでしょうか、ちなみに通常のcssファイルに書いたところ問題なく適用されていたのでcssの書方は間違ってなさそうです
4
4
 
5
5
 
6
6
 

1

追記

2021/08/25 01:39

投稿

Maar
Maar

スコア48

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,4 @@
1
- 現在vueを勉強中なのですが、classをトグルして文字のスタイルを変化させようとしても何故か変わりません。
1
+ 現在vueを勉強中なのですが、classをトグルして文字のスタイルを変化させようとしても何故か変わりません。classにはselectedがちゃんと入っているのに.selectedのスタイルが適用されていないようです。
2
2
 
3
3
  vue特有の記述方法があるのでしょうか、ちなみにcssファイルに書いたところ問題なく動きました。
4
4