我正在将SimpleForm 5.0.2
与ActionText一起使用。
我希望表单的主体字段为多行(例如10),但我不知道如何使它工作。
这是我目前的尝试:
<%= f.rich_text_area :body, class: 'form-control', name: "article-text", input_html: { rows: 10 }, placeholder: "Enter your article body here..." %>
产生此HTML:
<trix-editor class="form-control" input_html="{:rows=>10}" placeholder="Enter your article body here..." id="article_body" input="article_body_trix_input_article" data-direct-upload-url="http://localhost:3000/rails/active_storage/direct_uploads" data-blob-url-template="http://localhost:3000/rails/active_storage/blobs/:signed_id/:filename" contenteditable="" role="textbox" trix-id="1" toolbar="trix-toolbar-1"></trix-editor>
看起来像这样:
请注意,我还尝试了input_html:
的各种迭代,包括但不限于:
<%= ... input_html: { 'rows': '10' } ... %>
<%= ... input_html: { rows: "10" } ... %>
全部无济于事。
我如何使它工作?
rich_text_area
似乎只接受:class
选项,因此:input_html
在这里什么也不做。但是因为高度是由CSS决定的,所以我们可以通过覆盖trix-editor的默认最小高度CSS来达到所需的高度。
在app / assets / stylesheets / actiontext.scss
trix-editor {
&.customized-min-height {
min-height: 15em;
}
}
在您的视图文件中
f.rich_text_area :body, class: "form-control customized-min-height"