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

async support #896

Closed
pod4g opened this issue May 15, 2017 · 3 comments
Closed

async support #896

pod4g opened this issue May 15, 2017 · 3 comments

Comments

@pod4g
Copy link

pod4g commented May 15, 2017

I define a special markdown syntax for our editor

the syntas like this:

```sku
1120
```

the number is a id, I should fetch data by ajax (http://x.x.x.x/?id=1120), and then i will convert the data to html , but marked not support async

What should I do?

I think this solution is pretty good #798

Relevant issues: #458

thanks for any reply !

@pod4g
Copy link
Author

pod4g commented May 15, 2017

the ajax returned data like this:

{
 title: '天王盖地虎,宝塔震河妖',
 image: '//content.image.alimmdn.com/sku/1463573933Q3cRJL_jpg.jpeg',
 price: '¥250'
}

convert the data to html:

<div class="sku-card">
  <h1 class="sku-title">天王盖地虎,宝塔震河妖</h1>
  <img src="//content.image.alimmdn.com/sku/1463573933Q3cRJL_jpg.jpeg">
  <span class="sku-price">¥250</span>
</div>

@Feder1co5oave
Copy link
Contributor

You should override the code renderer in such a way that whenever lang == 'sku' you should return a <script> element whose code somehow performs the ajax request and then document.writes the content into the page.

@joshbruce
Copy link
Member

joshbruce commented Dec 27, 2017

Alternatively, you should be able to do it after the build. Seems like we are trying to make Markdown (and Marked) do more than it was intented to - convert Markdown to HTML based on specifications.


  ```sku
  1120
    ```

  Becomes something like this
  <code><pre>...</pre></code>

Might be more reasonable to do something like:

...markdown, markdown, markdown

<div class="sku-card" data-sku="1120"></div>

...markdown, markdown, markdown

Once the HTML is rendered, run the JS selector for data-sku - perform AJAX/J and build internals HTML. Also, for semantic HTML purposes may want to consider a different header level, or using an <article> for each sku-card instead of the div...so, if you're feeling particularly daring (and possible semantically incorrect).

<article is="sku-card" data-sku="1120"></article>

Becomes:

<article is="sku-card" data-sku="1120">
  <h1>...</h1>
  <img>
  <span>...</span>
</article>

You shouldn't need the extra classes because the wrapper says what you're playing with. If you use those components outside of the sku-card, then by all means continue using the classes or faux object inheritance.

Closing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants