Skip to content

Commit 1448b94

Browse files
fix: capitalize On/Off JS event function names in mobile docs (#263)
The JavaScript API exports On and Off (capitalized) per native.d.ts, but the docs showed on/off (lowercase). Updated all references in: - resources/views/docs/mobile/3/the-basics/events.md - resources/views/docs/mobile/3/the-basics/native-functions.md This aligns the documentation with the actual mobile-air source code.
1 parent 42d9dc9 commit 1448b94

2 files changed

Lines changed: 12 additions & 12 deletions

File tree

‎resources/views/docs/mobile/3/the-basics/events.md‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ Events are 'broadcast' to the frontend of your application via the web view thro
107107
easily listen for these events through JavaScript in a few ways:
108108

109109
- The globally available `Native.on()` helper
110-
- Directly importing the `on` function
110+
- Directly importing the `On` function
111111
- The `#[OnNative()]` PHP attribute Livewire extension
112112

113113
<aside>
@@ -133,43 +133,43 @@ Register the event listener directly in JavaScript:
133133

134134
This approach is useful if you're not using any particular frontend JavaScript framework.
135135

136-
#### The `on` import
136+
#### The `On` import
137137

138138
<aside>
139139

140140
Make sure you've [set up the `Native` plugin](native-functions#install-the-plugin) in your `package.json` first.
141141

142142
</aside>
143143

144-
If you're using a SPA framework like Vue or React, it's more convenient to import the `on` function directly to
144+
If you're using a SPA framework like Vue or React, it's more convenient to import the `On` function directly to
145145
register your event listeners. Here's an example using the amazing Vue:
146146

147147
```js
148-
import { on, Events } from '#nativephp';
148+
import { On, Events } from '#nativephp';
149149
import { onMounted } from 'vue';
150150

151151
const handleButtonPressed = (payload: any) => {};
152152

153153
onMounted(() => {
154-
on(Events.Alert.ButtonPressed, handleButtonPressed);
154+
On(Events.Alert.ButtonPressed, handleButtonPressed);
155155
});
156156
```
157157

158158
Note how we're also using the `Events` object above to simplify our use of built-in event names. For custom event
159159
classes, you will need to reference these by their full name:
160160

161161
```js
162-
on('App\\Events\\MyButtonPressedEvent', handleButtonPressed);
162+
On('App\\Events\\MyButtonPressedEvent', handleButtonPressed);
163163
```
164164

165-
In SPA land, don't forget to de-register your event handlers using the `off` function too:
165+
In SPA land, don't forget to de-register your event handlers using the `Off` function too:
166166

167167
```js
168-
import { off, Events } from '#nativephp';
168+
import { Off, Events } from '#nativephp';
169169
import { onUnmounted } from 'vue';
170170

171171
onUnmounted(() => {
172-
off(Events.Alert.ButtonPressed, handleButtonPressed);
172+
Off(Events.Alert.ButtonPressed, handleButtonPressed);
173173
});
174174
```
175175

‎resources/views/docs/mobile/3/the-basics/native-functions.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ section to the JSON:
5252
Run `npm install`, then in your JavaScript, simply import the relevant functions from the plugin:
5353

5454
```js
55-
import { on, off, Microphone, Events } from '#nativephp';
55+
import { On, Off, Microphone, Events } from '#nativephp';
5656
import { onMounted, onUnmounted } from 'vue';
5757

5858
const buttonClicked = () => {
@@ -64,11 +64,11 @@ const handleRecordingFinished = () => {
6464
};
6565

6666
onMounted(() => {
67-
on(Events.Microphone.MicrophoneRecorded, handleRecordingFinished);
67+
On(Events.Microphone.MicrophoneRecorded, handleRecordingFinished);
6868
});
6969

7070
onUnmounted(() => {
71-
off(Events.Microphone.MicrophoneRecorded, handleRecordingFinished);
71+
Off(Events.Microphone.MicrophoneRecorded, handleRecordingFinished);
7272
});
7373
```
7474

0 commit comments

Comments
 (0)