質問編集履歴
5
書式の改善
test
CHANGED
File without changes
|
test
CHANGED
@@ -134,7 +134,7 @@
|
|
134
134
|
|
135
135
|
|
136
136
|
|
137
|
-
####
|
137
|
+
####妥協案1 クラス名だけ変数をつかう
|
138
138
|
|
139
139
|
```
|
140
140
|
|
4
書式の改善
test
CHANGED
File without changes
|
test
CHANGED
@@ -78,7 +78,9 @@
|
|
78
78
|
|
79
79
|
|
80
80
|
|
81
|
+
|
82
|
+
|
81
|
-
|
83
|
+
####方法1 パーシャルレイアウトを使う
|
82
84
|
|
83
85
|
|
84
86
|
|
@@ -114,7 +116,7 @@
|
|
114
116
|
|
115
117
|
|
116
118
|
|
117
|
-
|
119
|
+
####方法2 メソッドを使う
|
118
120
|
|
119
121
|
|
120
122
|
|
@@ -132,7 +134,7 @@
|
|
132
134
|
|
133
135
|
|
134
136
|
|
135
|
-
|
137
|
+
#### クラス名だけ変数をつかう
|
136
138
|
|
137
139
|
```
|
138
140
|
|
@@ -156,9 +158,7 @@
|
|
156
158
|
|
157
159
|
|
158
160
|
|
159
|
-
- 妥協案2
|
160
|
-
|
161
|
-
サブルーチンのコードをブロックごとにわける
|
161
|
+
####妥協案2 サブルーチンのコードをブロックごとにわける
|
162
162
|
|
163
163
|
```
|
164
164
|
|
3
書式の改善
test
CHANGED
File without changes
|
test
CHANGED
@@ -38,7 +38,7 @@
|
|
38
38
|
|
39
39
|
|
40
40
|
|
41
|
-
|
41
|
+
HTML には最低限のクラスのみをつけて
|
42
42
|
|
43
43
|
SCSS でセレクタを使って bootstrap のクラスを extend して適用する
|
44
44
|
|
@@ -68,19 +68,17 @@
|
|
68
68
|
|
69
69
|
|
70
70
|
|
71
|
-
|
71
|
+
https://teratail.com/questions/142621
|
72
72
|
|
73
|
-
で質問し
|
73
|
+
で質問して結局 HTML に bootstrap のクラスをつけるしかないという結論に
|
74
74
|
|
75
75
|
|
76
76
|
|
77
|
-
|
77
|
+
→ Rails 側でなるべく共通の部品をサブルーチン化してクラス指定をまとめたい
|
78
78
|
|
79
79
|
|
80
80
|
|
81
|
-
|
82
|
-
|
83
|
-
|
81
|
+
- 方法1 パーシャルレイアウトを使う
|
84
82
|
|
85
83
|
|
86
84
|
|
@@ -116,13 +114,17 @@
|
|
116
114
|
|
117
115
|
|
118
116
|
|
117
|
+
- 方法2 メソッドを使う
|
118
|
+
|
119
|
+
|
120
|
+
|
119
121
|
https://teratail.com/questions/143292
|
120
122
|
|
121
|
-
ここで
|
123
|
+
ここでメソッド化する書き方を教えていただいたのですが
|
122
124
|
|
123
125
|
def acc(&block1, &block2)
|
124
126
|
|
125
|
-
のように複数のブロックを引
|
127
|
+
のように複数のブロックを引数にとれないらしくどうしたらいいか困っています
|
126
128
|
|
127
129
|
|
128
130
|
|
@@ -130,9 +132,7 @@
|
|
130
132
|
|
131
133
|
|
132
134
|
|
133
|
-
妥協
|
135
|
+
- 妥協案1 クラス名だけ変数をつかう
|
134
|
-
|
135
|
-
|
136
136
|
|
137
137
|
```
|
138
138
|
|
@@ -152,9 +152,11 @@
|
|
152
152
|
|
153
153
|
```
|
154
154
|
|
155
|
-
とかく
|
155
|
+
とかく
|
156
156
|
|
157
157
|
|
158
|
+
|
159
|
+
- 妥協案2
|
158
160
|
|
159
161
|
サブルーチンのコードをブロックごとにわける
|
160
162
|
|
@@ -166,4 +168,6 @@
|
|
166
168
|
|
167
169
|
```
|
168
170
|
|
171
|
+
|
172
|
+
|
169
173
|
というのを考えていますがどうするのがきれいな書き方なのでしょうか
|
2
書式の改善
test
CHANGED
File without changes
|
test
CHANGED
@@ -12,9 +12,13 @@
|
|
12
12
|
|
13
13
|
たとえば
|
14
14
|
|
15
|
+
```
|
16
|
+
|
15
17
|
<h2 class=".....">ラベル</h2>
|
16
18
|
|
17
19
|
<p class=".....">コンテンツ</p>
|
20
|
+
|
21
|
+
```
|
18
22
|
|
19
23
|
みたいなアコーディオンやカードといったよく使う部品のレイアウトを調整したくて
|
20
24
|
|
@@ -40,6 +44,8 @@
|
|
40
44
|
|
41
45
|
|
42
46
|
|
47
|
+
```
|
48
|
+
|
43
49
|
<div class="acc">
|
44
50
|
|
45
51
|
<h2></h2>
|
@@ -52,7 +58,7 @@
|
|
52
58
|
|
53
59
|
.acc > p { @extend .p-1 }
|
54
60
|
|
55
|
-
|
61
|
+
```
|
56
62
|
|
57
63
|
|
58
64
|
|
@@ -138,9 +144,13 @@
|
|
138
144
|
|
139
145
|
と定義してアコーディオンの部品に毎回
|
140
146
|
|
147
|
+
```
|
148
|
+
|
141
149
|
<h2 class="<%=@acc_label_class%>"
|
142
150
|
|
143
151
|
<p class="<%=@acc_contents_class%>"
|
152
|
+
|
153
|
+
```
|
144
154
|
|
145
155
|
とかくか
|
146
156
|
|
@@ -148,8 +158,12 @@
|
|
148
158
|
|
149
159
|
サブルーチンのコードをブロックごとにわける
|
150
160
|
|
161
|
+
```
|
162
|
+
|
151
163
|
def acc_label(&block)
|
152
164
|
|
153
165
|
def acc_contents(&block)
|
154
166
|
|
167
|
+
```
|
168
|
+
|
155
169
|
というのを考えていますがどうするのがきれいな書き方なのでしょうか
|
1
内容修正
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
Rails
|
1
|
+
Rails で複数ブロックを受け取って複数回よべるサブルーチンって作れますか?
|
test
CHANGED
@@ -1,229 +1,155 @@
|
|
1
|
-
以前 https://teratail.com/questions/143292 で view のサブルーチン化の書き方を教えてもらったのですが
|
2
|
-
|
3
|
-
|
1
|
+
###やりたいこと
|
4
2
|
|
5
3
|
|
6
4
|
|
7
|
-
|
5
|
+
Rails で動いているシステムに bootstrap ベースのテンプレートやテーマをいろいろあててデザインをみたい
|
8
6
|
|
9
7
|
|
10
8
|
|
11
|
-
呼び出すところは以下で固定して
|
12
|
-
|
13
|
-
|
9
|
+
###問題点
|
14
|
-
|
15
|
-
<div>
|
16
|
-
|
17
|
-
<div>
|
18
|
-
|
19
|
-
<div>
|
20
|
-
|
21
|
-
<%= test('TEST') do %>
|
22
|
-
|
23
|
-
<p>CONTENTS</p>
|
24
|
-
|
25
|
-
<% end %>
|
26
|
-
|
27
|
-
</div>
|
28
|
-
|
29
|
-
</div>
|
30
|
-
|
31
|
-
</div>
|
32
|
-
|
33
|
-
```
|
34
10
|
|
35
11
|
|
36
12
|
|
13
|
+
たとえば
|
14
|
+
|
15
|
+
<h2 class=".....">ラベル</h2>
|
16
|
+
|
17
|
+
<p class=".....">コンテンツ</p>
|
18
|
+
|
19
|
+
みたいなアコーディオンやカードといったよく使う部品のレイアウトを調整したくて
|
20
|
+
|
21
|
+
コンテンツのクラスに p-1 を追加したいみたいなときに
|
22
|
+
|
23
|
+
あちこちの view にちらばってる部品を使ってる場所全部に p-1 を追加して回らなければならない
|
24
|
+
|
37
|
-
|
25
|
+
表示してみてやっぱり px-2 px-1 にしようとかなったらまた書き直し
|
38
26
|
|
39
27
|
|
40
28
|
|
41
|
-
```erb
|
42
|
-
|
43
|
-
<%
|
44
|
-
|
45
|
-
def test(head, &block)
|
46
|
-
|
47
|
-
content_tag(:h2, head)
|
48
|
-
|
49
|
-
|
29
|
+
→ なるべく同じ部品のクラスを1回の記述でまとめてレイアウト調整できるようにしたい
|
50
|
-
|
51
|
-
end
|
52
|
-
|
53
|
-
%>
|
54
|
-
|
55
|
-
```
|
56
|
-
|
57
|
-
```html
|
58
|
-
|
59
|
-
<div>
|
60
|
-
|
61
|
-
<div>
|
62
|
-
|
63
|
-
<div>
|
64
|
-
|
65
|
-
<div>
|
66
|
-
|
67
|
-
<p>CONTENTS</p>
|
68
|
-
|
69
|
-
</div> </div>
|
70
|
-
|
71
|
-
</div>
|
72
|
-
|
73
|
-
</div>
|
74
|
-
|
75
|
-
```
|
76
|
-
|
77
|
-
なぜかヘッドが表示されない
|
78
30
|
|
79
31
|
|
80
32
|
|
81
|
-
|
33
|
+
###ためしたこと
|
82
34
|
|
83
|
-
```erb
|
84
35
|
|
85
|
-
<% def test(head, &block) %>
|
86
36
|
|
87
|
-
|
37
|
+
- HTML には最低限のクラスのみをつけて
|
88
38
|
|
89
|
-
|
39
|
+
SCSS でセレクタを使って bootstrap のクラスを extend して適用する
|
90
40
|
|
91
|
-
<% end %>
|
92
41
|
|
93
|
-
```
|
94
42
|
|
95
|
-
|
43
|
+
<div class="acc">
|
96
44
|
|
97
|
-
<
|
45
|
+
<h2></h2>
|
98
46
|
|
99
|
-
<div>
|
100
|
-
|
101
|
-
<div>
|
102
|
-
|
103
|
-
<h2>TEST</h2>
|
104
|
-
|
105
|
-
<div>
|
106
|
-
|
107
|
-
|
47
|
+
<p></p>
|
108
48
|
|
109
49
|
</div>
|
110
50
|
|
111
51
|
|
112
52
|
|
113
|
-
|
53
|
+
.acc > p { @extend .p-1 }
|
114
54
|
|
115
|
-
|
55
|
+
という感じ
|
116
56
|
|
57
|
+
|
58
|
+
|
59
|
+
→ @extend で bootstrap クラスを指定するには @import bootstrap を全部の部品でかかなければいけなくて
|
60
|
+
|
61
|
+
全部の部品の CSS に bootstrap の中身が展開されて肥大化する
|
62
|
+
|
63
|
+
|
64
|
+
|
65
|
+
- https://teratail.com/questions/142621
|
66
|
+
|
67
|
+
で質問した結局 HTML に bootstrap のクラスをつけるしかないという結論に
|
68
|
+
|
69
|
+
|
70
|
+
|
71
|
+
- Rails 側でなるべく共通の部品のクラス指定をまとめたい
|
72
|
+
|
73
|
+
|
74
|
+
|
75
|
+
|
76
|
+
|
117
|
-
|
77
|
+
→ Rails で部品をサブルーチン化したい
|
78
|
+
|
79
|
+
|
80
|
+
|
81
|
+
partial layout を使って _acc.html.erb に
|
82
|
+
|
83
|
+
```erb
|
84
|
+
|
85
|
+
<h2 class="...", href="#<%=id%>"><%= yield :head %></h2>
|
86
|
+
|
87
|
+
<p class="..." id="<%=id%>"<%= yield %></p>
|
118
88
|
|
119
89
|
```
|
120
90
|
|
91
|
+
と名前付き yield でブロックを展開しようとしても
|
92
|
+
|
93
|
+
```erb
|
94
|
+
|
121
|
-
|
95
|
+
<%= render layout: ’acc’ do %>
|
96
|
+
|
97
|
+
content_for :head do
|
98
|
+
|
99
|
+
ラベル
|
100
|
+
|
101
|
+
end
|
102
|
+
|
103
|
+
コンテンツ
|
104
|
+
|
105
|
+
end
|
106
|
+
|
107
|
+
```
|
108
|
+
|
109
|
+
を複数回よぶと名前付きの方だけなぜか記述が重複して表示されてしまう
|
122
110
|
|
123
111
|
|
124
112
|
|
125
|
-
|
113
|
+
https://teratail.com/questions/143292
|
126
114
|
|
127
|
-
|
115
|
+
ここでパーシャルを使わずにサブルーチン化する書き方を教えていただいたのですが
|
128
116
|
|
129
|
-
|
117
|
+
def acc(&block1, &block2)
|
130
118
|
|
131
|
-
|
119
|
+
のように複数のブロックを引く数にとれないらしくどうしたらいいか困っています
|
132
120
|
|
133
|
-
<%= content_tag(:div) do %>
|
134
121
|
|
135
|
-
<%= yield %>
|
136
122
|
|
137
|
-
|
123
|
+
Rails ではブロック複数をうけとって複数回呼び出せるサブルーチンを作るのは不可能なのでしょうか
|
138
124
|
|
125
|
+
|
126
|
+
|
139
|
-
|
127
|
+
妥協としてはクラス変数をつかって
|
128
|
+
|
129
|
+
|
140
130
|
|
141
131
|
```
|
142
132
|
|
143
|
-
|
133
|
+
@acc_label_class=...
|
144
134
|
|
145
|
-
|
135
|
+
@acc_contents_class=...
|
146
136
|
|
147
|
-
|
137
|
+
```
|
148
138
|
|
149
|
-
|
139
|
+
と定義してアコーディオンの部品に毎回
|
150
140
|
|
151
|
-
|
141
|
+
<h2 class="<%=@acc_label_class%>"
|
152
142
|
|
153
|
-
<
|
143
|
+
<p class="<%=@acc_contents_class%>"
|
154
144
|
|
155
|
-
|
156
|
-
|
157
|
-
|
145
|
+
とかくか
|
158
146
|
|
159
147
|
|
160
148
|
|
161
|
-
|
149
|
+
サブルーチンのコードをブロックごとにわける
|
162
150
|
|
151
|
+
def acc_label(&block)
|
163
152
|
|
153
|
+
def acc_contents(&block)
|
164
154
|
|
165
|
-
</div><div>
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
155
|
+
というのを考えていますがどうするのがきれいな書き方なのでしょうか
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
<p>CONTENTS</p>
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
</div> </div>
|
178
|
-
|
179
|
-
</div>
|
180
|
-
|
181
|
-
</div>
|
182
|
-
|
183
|
-
```
|
184
|
-
|
185
|
-
なんかエスケープされたタグが重複表示される…
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
---
|
190
|
-
|
191
|
-
```erb
|
192
|
-
|
193
|
-
<% def test(head, &block) %>
|
194
|
-
|
195
|
-
<%= content_tag(:h2, head) %>
|
196
|
-
|
197
|
-
<%= content_tag(:div) do %>
|
198
|
-
|
199
|
-
<%= yield %>
|
200
|
-
|
201
|
-
<% end %>
|
202
|
-
|
203
|
-
<% end %>
|
204
|
-
|
205
|
-
```
|
206
|
-
|
207
|
-
```html
|
208
|
-
|
209
|
-
<div>
|
210
|
-
|
211
|
-
<div>
|
212
|
-
|
213
|
-
<div>
|
214
|
-
|
215
|
-
<h2>TEST</h2>
|
216
|
-
|
217
|
-
<div>
|
218
|
-
|
219
|
-
<p>CONTENTS</p>
|
220
|
-
|
221
|
-
</div> </div>
|
222
|
-
|
223
|
-
</div>
|
224
|
-
|
225
|
-
</div>
|
226
|
-
|
227
|
-
```
|
228
|
-
|
229
|
-
表示は正しいけどやっぱりインデントがずれる…
|