Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Vue] The idea of ​​making RenderController are reactive #2160

Open
wants to merge 5 commits into
base: 2.x
Choose a base branch
from

Conversation

7-zete-7
Copy link
Contributor

Q A
Bug fix? no
New feature? yes
Issues Fix #...
License MIT

The idea is to create a bridge between the reactivity of Stimulus values ​​and the reactivity of Vue.js properties.

This would allow to influence the properties of a Vue.js component from the outside without implementing an additional Stimulus controller for this.

Changes to the properties passed to the Vue.js component inside the component would also reflect their change in the Stimulus values.

I have already implemented something similar in some projects. It would be very convenient if this worked out of the box and was useful to someone else.

@carsonbot carsonbot added Feature New Feature Vue Status: Needs Review Needs to be reviewed labels Sep 12, 2024
@7-zete-7 7-zete-7 force-pushed the patch-2 branch 5 times, most recently from bd4b700 to 3d15adf Compare September 12, 2024 22:58
Copy link
Collaborator

@smnandre smnandre left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not the target user here, so i'll wait opinion of the others :)

Could you maybe add a couple of tests ... and maybe add this to the documentation with a short description + example ?

Thank you for sharing and contributing :)

@7-zete-7
Copy link
Contributor Author

Added some tests to make sure it really works.

Fixed the non-working mechanism.

@7-zete-7 7-zete-7 force-pushed the patch-2 branch 2 times, most recently from fdec785 to 8c28924 Compare September 28, 2024 20:00
Comment on lines +223 to +235
.. code-block:: javascript

// update likes component props
document.getElementById('likes-component').dataset.vuePropsValue = JSON.stringify({
likes: newLikesCount,
alreadyLike: isAlreadyLike,
});

.. code-block:: javascript

// get likes component actual props
const { likes, alreadyLike } = JSON.parse(document.getElementById('likes-component').dataset.vuePropsValue);

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried to make examples untied from other components. It is more logical, of course, to use Stimulus controllers to perform actions with parameters.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature New Feature Status: Needs Review Needs to be reviewed Vue
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants