I have an outer all posts loop and an inner user post likes history loop,this is the logic to show the button that liked my post
this is my code logic to show the button that liked ny post
how do i know when i click that like button i will like or unlike that post and send API request to server (works like facebook like function)
this is my code
im a using vue 3,an i am a new bie,Any advice to keep my code clean,thank
Related
I’d like to integrate vue into a existing webproject. In detail I want to use vue to integrate data from www.autoscout24.de into a website which basically uses Modx-cms, which means that the routing generally takes place inside Modx. With vue I want to realize a search form which I can integrate anywhere inside the existing website. The results should display under something like domain.tld/cars and a single car should be displayed at something like domain.tld/cars/cardetails#8574746
So regarding the routing I guess /cars and /cars/cardetails will be regular sites of the cms (vue only shows the data) but the Hashtag-routing for cardetails will be handled by vue, right?
As the App (should I call it three different apps?) will not be a SAP how can I pass data between the search form, /cars and /cars/cardetails#xyz? Is local storage the way to go?
Is that the right approach. Maybe my approach is even completely wrong, as I am new to vue?
Some further details regarding the app:
The searchform will react to every user input with a request to the Graph QL-Api in order to show the user live how many results he will get. Above the form there will be a teaser with around 10 random cars. After submitting the form the user is directed to /cars where he receives his resultslist (photos of the cars + some quick information). Above the list I want to show the filters so the user can adjust the resultslist. When the user clicks on the car he will get directed to /cars/cardetails#xyz where xyz is the id of the car in order to fetch the cardetails from the api via js/graphql.
Kind regards
Here are some screens to illustrate it. The parts which should be realized with vue are marked red.
I am building a react native apps using crna where there's flat list that showing data from API. It's quite like twitter or facebook's status feeds. And I would like to show some badge like this
When there's a new post and to make user aware of new post so they will refresh it.
Could anyone tell me what should I do to make this happen?
Thank you so much.
Not sure if you're using some kind of state management tool like redux, but it would just be a matter of calling the API every so-often and updating the state from there. I'm going to use redux as an example since it's quite popular
You'd prob want state that has the following info:
currentPosts: [] //array of posts that the user already sees
newPosts: [] // array of new posts user can't see until they hit "new posts" button
With redux, you can have a function that gets called every 5 or 10 seconds that checks the API to show where you get new post data from. If there is a new post, add it to the newPosts array. This would update state, and if your component is connected to state, it would update props.
With this logic, you'd be able to determine whether or not you should show the "new posts" button with a simple boolean. If the array is empty, hide it, if it isn't, show the button.
Once the button is clicked, you could update the state so that the newPosts data goes into the currentPosts array and those items will get rendered from there.
Hope this makes sense! There may be quite a lot I'm missing but that's the idea of how it could work. Lemme know if you have any questions
There are a few similar posts but they are quite out of date and Tumblr has updated the like part of the API not too long ago as far as I'm aware.
Creating a like button is as simple as
{LikeButton}
and this works great, but after the ajax recalls to get more posts from what would be the next page, the like button no longer works.
I have had a look at the documentation and it states that I need to implement one of the following, I was wondering if anyone could point me in the right direction? I've been trying to get this to work for hours.
I made up an example blog if this helps contribute to answering, the javascript can do the mass amount of the implementing of new images.
http://stackoverflowexample.tumblr.com/
If you need anymore info, i'll happily edit this and add what's required, thank you!
Overview
Adapted from my previous answer here: Using Tumblr Like Button with Infinite Scroll
Tumblr states we need to call one of two functions to get the Like Status. I would suggest the following:
Function: Tumblr.LikeButton.get_status_by_post_ids([n,n,n])
Description: Request Like status for individual posts. Takes an array of post IDs
Once the ajax request is successful , we should have a data object (containing new posts, etc).
We need to create an array of postIDs, which is an array containing an ID / number for each post in the data object. Easiest way to add the the post id is to use the theme variable {PostID}.
Example
HTML
<article class="post" id="{PostID}">...</article>
jQuery Post IDs Array
var $newPosts = $(data).find('.post');
var $newPostIDs = $newPosts.map(function () {
return $(this).attr('id');
}).get();
Tumblr.LikeButton
Tumblr.LikeButton.get_status_by_post_ids($newPostIDs);
Hints
Create the array and call Tumblr.LikeButton once the ajax request is successful and in a place where you run other functions for the new Posts. This can also be done with pure javascript as using: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
Here is my situation.
I have two facebook likes on a single page and a single facebook comment. (using javascript sdk facebook)
I tried to like one of the facebook likes and it opens the facebook login authorization window where i enter my login details. The like works fine for that particular button only. When i click on another like button in the same page, it opens a popup window and closes it suddenly.. But no likes registered for the second button. For the another like button to work, i need to refresh the page... and the same case is with the facebook comments plugin...
Please suggest me a way such that if the user initiates the login using one of the buttons, the other facebook like and the comment will automatically work without the need to refresh the page...I got the clue to refresh the facebook plugins entirely by using
FB.XFBML.parse();
But i don't know to attach the above function to the particular event...
Check this url
http://hillarsaare.com/projects/facebook/multi-like/
Where you can see multiple like buttons on the same page...If you are already logged in through facebook and visit that page, you will be able to like all the posts there...But if you are not logged in and visit that page, clicking one of the like buttons will prompt you to login through facebook and after logging in, you will not be able to like any other posts in the page except that post you clicked like...When you do page refresh, it will work fine...
Thank you
I think that you can use this work-around for every like button on your page:
Subscribing to the auth.statusChange
(http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/)
and check to see if it is a sucessful login. If so, re-render the like
button code into your DOM and then have the Javascript SDK re-parse it
using FB.XFBL.parse()
(http://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/)
Similar to:
Facebook like button status update
I need to POST a HTML form to a 3rd party website (a Mass-SMS texting system).
In the past I've done this by forwarding to a page containing a form I've pre-populated and hidden (using display:none), then I've ran a javascript function at the end of the page to automatically submit this form.
However I'm hoping theres someway I can do all this programmatically (as I don't care about the response, and the user doesn't need to see the page the form is being posted to).
How can I do this? Cheers
You could use a WebClient.UploadValues method to send an HTTP POST request to a remote server from your code behind. Just fill up the name/value collection with the values coming from the hidden fields.
If you're willing to get into PHP, you can very easily use cURL for this.
Otherwise it's going to be quite difficult using just Javascript.
See here for a detailed tutorial.