Skip to content

Commit 58d0400

Browse files
committed
Update README.md (on :v option)
1 parent f3e46c3 commit 58d0400

File tree

1 file changed

+44
-7
lines changed

1 file changed

+44
-7
lines changed

README.md

Lines changed: 44 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,33 @@ vue-form-for
44
A custom Rails form builder for Vue.js
55

66
Synopsis
7+
--------
8+
9+
```
10+
<%= vue_form_for User.new do |f| %>
11+
<%= f.text_field :name %>
12+
<% end %>
13+
```
14+
15+
```html
16+
<form ...>
17+
...
18+
<input v-model="user.name" type="text" name="user[name]" ... />
19+
</form>
20+
```
21+
22+
Installation
23+
------------
24+
25+
Add the following line to `Gemfile`:
26+
27+
```ruby
28+
gem "vue-form-for"
29+
```
30+
31+
Run `bundle install` on the terminal.
32+
33+
Usage
734
-----
835

936
```
@@ -49,21 +76,31 @@ document.addEventListener("DOMContentLoaded", () => {
4976
Add this line to the ERB template:
5077

5178
```text
52-
<%= javascript_pack_tag 'new_user_form' %>
79+
<%= javascript_pack_tag "new_user_form" %>
5380
```
5481

5582
Then, you can get the value of `user[name]` field by the `user.name`.
5683

57-
Installation
58-
------------
84+
Other Functionalities
85+
---------------------
5986

60-
Add the following line to `Gemfile`:
87+
You can provide a hash to the `:v` option:
6188

62-
```ruby
63-
gem 'vue-form-for'
89+
```
90+
<%= vue_form_for User.new do |f| %>
91+
<%= f.text_field :name, v: { model: "customer.name" } %>
92+
<%= f.submit "Create", v: { if: "submittable" } %>
93+
<% end %>
6494
```
6595

66-
Run `bundle install` on the terminal.
96+
The above ERB template is identical with the following one:
97+
98+
```
99+
<%= vue_form_for User.new do |f| %>
100+
<%= f.text_field :name, "v-model" => "customer.name" %>
101+
<%= f.submit "Create", "v-if" => "submittable" %>
102+
<% end %>
103+
```
67104

68105
License
69106
-------

0 commit comments

Comments
 (0)