|
@@ -57,6 +57,22 @@ export default function () => ({
|
|
|
})
|
|
|
```
|
|
|
|
|
|
+<a name="initial-parameters"></a>
|
|
|
+## Initial Parameters
|
|
|
+
|
|
|
+In addition to referencing `Alpine.data` providers by their name plainly (like `x-data="dropdown"`), you can also reference them as functions (`x-data="dropdown"`). By calling them as functions directly, you can pass in additional parameters to be used when creating the initial data object like so:
|
|
|
+
|
|
|
+```html
|
|
|
+<div x-data="dropdown(true)">
|
|
|
+```
|
|
|
+```js
|
|
|
+Alpine.data('dropdown', (initialOpenState = false) => ({
|
|
|
+ open: initialOpenState
|
|
|
+}))
|
|
|
+```
|
|
|
+
|
|
|
+Now, you can re-use the `dropdown` object, but provide it with different parameters as you need to.
|
|
|
+
|
|
|
<a name="init-functions"></a>
|
|
|
## Init functions
|
|
|
|