Django和Vue -Django标签中的Vue变量

w8biq8rn 于 2023-04-07 发布在 Vue.js

关注(0)|答案(2)|浏览(160)

在一个Django-Html模板上，我需要呈现这行代码：

<form action="{% url 'meal:submit_comment_rating' meal_id=meal.id comment_id=[[ comment.comment_id ]] %}" method="post">

在Vue for循环中：

<div v-for="comment in comments" id="comment_[[ comment.pk ]]">
  ...
</div>

其中[[ comment.comment_id ]]被替换为相应的Vue变量：

meal_comments_sort = new Vue({
  delimiters: ['[[', ']]'],
  el: '#meal_comments_section',
  data: {
    comments: [
      {
        "meal_id":1,
        "user_id":1,
        "username":"admin",
        "comment_id":1,
        "comment_type":"mealcomment",
        "date":"2020-09-01T14:18:24.563Z",
        "content":"time for comment",
        "rating":-1
      },
    ],
  },
});

我收到了Django错误Could not parse the remainder: '[[' from '[['，这是我所期望的，但找不到解决方法。

最好的方法是什么

我曾尝试将[[ comment.comment_id ]]变量 Package 在{% verbatim %}标记中，但没有帮助（可能是因为这些标记不应该这样使用）。

vue.js

来源：https://stackoverflow.com/questions/63741889/django-and-vue-vue-variable-in-django-tag

2条答案

按热度按时间

5jdjgkvh1#

我的解决方案是用包含Vue变量的静态URL替换Django URL解析标签：

<form :action="'/meal/{{ meal.pk }}/rate/comment/' + comment.comment_id + '/'" method="post">

如果有更好的方法来做到这一点，我仍然宁愿使用它们。

赞(0）回复(0）举报 2023-04-07

zf9nrax12#

我遇到了一个非常类似的问题：
点击后，下面的a标记必须根据vue变量www.example.com的值重定向到一个新的urlresult.id:

<a href="{% url 'detail' [[result.id]] %}" id="link">Go to Page</a>

首先，如果当前URL是“/tools/browse/”，则以下a标记将重定向到“/tools/browse/tools/7”。

<a href="/tools/[[ result.id ]]" id="link">Go to Page</a>

但这不是我们想要的！
我通过调用vue中的一个JavaScript函数来解决这个问题，该函数重定向到URL：
1.在javascript中为一些任意参数创建url标签：

{% url 'tools:detail' 9999 as the_url%}
{{ the_url|json_script:"result_id"}}
{% endblock %}

（我选择值9999，因为它永远不会出现作为一个真实的的网址路径.是的，我知道这是不理想的，非常糟糕的风格！请评论，如果你知道一个更好的方法！）
1.将变量加载到js-script中：

const result_id = JSON.parse(document.getElementById('result_id').textContent);

（result_id现在的值为“/tools/9999/”）
1.在vue中定义一个名为“redirect_vue”的方法：

methods: {
     redirect_vue: function (id) {
         window.location = your_base_url + result_id.split("9999")[0] + id
     }
}

这将获取“/tools/9999/”的“/tools/”并附加正确的ID。“redirect_vue（7）”的结果是“http://127.0.0.1/tools/7“，其中“your_base_url=http：//127.0.0.1”。
因此，如果单击下面的a标记，它将重定向到正确的URL，即“http://127.0.0.1/tools/7”。

<a @click="redirect_vue(result.id)" id="link">Go to Page</a>

赞(0）回复(0）举报 2023-04-07

我来回答

Django和Vue -Django标签中的Vue变量

2条答案

相关问题

热门标签

最新问答