一、今晚遇到一个问题，就是不能直接在 html 直接调用 js 代码的问题

二、会出现如下错误：

    Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-    vKuX0yKlIAX3ZzZ9/PIUq7x1z425uZLu4glsP+4fqXM='), or a nonce ('nonce-...') is required to enable inline execution.

三、解决方法，就是将 js 代码写成单独的文件，然后包含进去即可。

    # index.html

    <!DOCTYPE html>

    <html>

      <head>

        <script src="js/vue.min.js"> </script>

      </head>

      <body>

        <div id="chen_test_id1">

          <p>{{ message }}</p>

        </div>

        <script src="js/test.js"> </script>

      </body>

    </html>


    // js/test.js

    src="js/vue.min.js">

    new Vue({

      el: '#chen_test_id1',

      data: {

        message: 'Hello Vue.js!'

      }

    })

Chrome 调用vue.js 记录的更多相关文章

  1. iOS 或者Android调用vue.js 里面的方法

    1.原生调用vue.js 某个vue组件下的方法. 比如**.vue里面有个这样的方法: 如果这样的话,在iOS或者Android里面是调用不了这个ajax方法的. 需要在**.vue (我的版本是v ...

  2. chrome调试vue.js的插件：vue.js devtools

    1.什么是vue.js devtools? vue.js devtools是chrome的一款插件,用来调试vue的一款神器. 2.为什么下载vue.js devtools? 由于vue是数据驱动的, ...

  3. Chrome安装Vue.js devtool F12无效

    要安装 vue-devtools-4.1.4_0 链接: https://pan.baidu.com/s/1aeUxKJEUDW0U_i6uuAZFvQ 提取码: 4btc vue-devtools- ...

  4. vue-axios当只调用vue.js又需要axios请求多时

    可以将axios方法封装一个函数 (function () { ASK = { get:function (url,data,succFun,errFun) { axios.get(url,{ par ...

  5. oc 与 js交互之vue.js

    - .vue.js 调用oc的方法并传值 vue.js 组件中调用方法: methods: {     gotoDetail(item){         //此方法需要在移动端实现,这里可以加入判断 ...

  6. Vue.js模板语法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 每天记录一点：NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发

    每天记录一点:NetCore获得配置文件 appsettings.json   用NetCore做项目如果用EF  ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...

  8. Vue.js中，如何自己维护路由跳转记录？

    在Vue的项目中,如果我们想要做返回.回退操作时,一般会调用router.go(n)这个api,但是实际操作中,使用这个api有风险,就是会让用户跳出当前应用,因为它记录的是浏览器的访问记录,而不是你 ...

  9. vue.js学习记录

    vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog,欢迎大家加star~~ vue实例 生命周期 beforeCreate:不能访问thi ...

随机推荐

  1. Android 自定义可拖拽View，界面渲染刷新后不会自动回到起始位置

    以自定义ImageView为例: /** * 可拖拽ImageView * Created by admin on 2017/2/21. */ public class FloatingImageVi ...

  2. ARGB和PARGB

    原文链接: http://blog.csdn.net/lnwaycool/article/details/8610313 ARGB和PARGB是针对32位图像而言的,Windows下图像可以是1位.4 ...

  3. Android NDK r9的配置与使用

    Android NDK 配置: 网上有很多教程,但大部分是旧版本的内容,最新版本的已经改变,为了让大家少走弯路,在这里针对r9的配置进行记录分享. 要玩NDK,你或多或少要用到以下一些东西,所以先做一 ...

  4. git概念及工作流程详解

    git概念及工作流程详解 既然我们已经把gitlab安装完毕[当然这是非必要条件],我们就可以使用git来管理自己的项目了,前文也多多少少提及到git的基本命令,本文就先简单对比下SVN与git的区别 ...

  5. wordxml文档格式说明

    近期需要对word xml文档进行各种操作,需要熟悉 wordxml 文档格式,搜索了一番后发现 open xml sdk 官网的文档最好.就按照官网说明来记录一番 1 word xml 文档基本格式 ...

  6. ubuntu 安装 2.10.x版本的scala

    Ubuntu 14.04.1 LTS上默认的scala版本是2.9的,而最新版本的spark-1.3需要最低版本的scala版本为2.10.x,先使用apt-get remove scala将机器上的 ...

  7. 使用vlc实现视频TS流的推送

    鉴于Mpeg TS流播放的需求,使用 VLC作为Server来实现输出Mpeg TS    本文仅涉及如何使用VLC的Command来实现作为视频流Server通常可以使用下述四种方式来推送Mpeg ...

  8. Shiro系列(2) - 权限模型以及权限分配的两种方式

    1. 顶级账户分配权限用户需要被分配相应的权限才可访问相应的资源.权限是对于资源的操作一张许可证.给用户分配资源权限需要将权限的相关信息保存到数据库.这些相关内容包含:用户信息.权限管理.用户分配的权 ...

  9. Java Web(十一) 分页功能的实现

    虽然现在有很多好用的框架,对分页进行支持,很简单的就把分页的效果做出来,但是如果自己手写是一个怎样的流程的?今天就来说说它,手动实现分页效果. --WH 一.分页的思路 首先我们得知道写分页代码时的思 ...

  10. 浅析Java中的final关键字--转

    转载自:http://www.importnew.com/18586.html#comment-581628 谈到final关键字,想必很多人都不陌生,在使用匿名内部类的时候可能会经常用到final关 ...